59
One (Sleepless) Interaction Designer’s experience doing mobile design in Agile! Vijay Hanumolu @vijju2k © 2011 KRONOS INCORPORATED I May 31, 2011 4 mobile apps 2 dev teams 1 enterprise mobile solution

Enterprise Mobile UX Designing in Agile

Embed Size (px)

DESCRIPTION

We developed 4 native apps (iPhone, Andorid, Blackberry, and J2ME) with 2 development team, all at the same time within a 7 month period, and 1 Interaction designer.In this session I will share my experience as a the lead designer on the project, how we planned the design aspects of the project, some creative ways of doing quick usability evaluations as mobile phone is such a personal device, how we achieved consistency across the various platforms, some of creative ways we came up to effectively use designer-developer collaboration so that I don’t have to create Hifi’s for every screen on every phone platform we supported.Im hoping you can learn from my experience - if you are planning to design/build mobile apps across multiple mobile platforms or if you have already started the process. This will also help you to learn how and what is required when development team is offshore or non co-located, especially in an Agile Scrum framework. And at the end of the session I will also provide a list of useful design resources that I used over the project to help design and usability go faster.

Citation preview

Page 1: Enterprise Mobile UX Designing in Agile

One (Sleepless) Interaction Designer’s experience doing mobile design in Agile!

Vijay Hanumolu@vijju2k

© 2011 KRONOS INCORPORATED I May 31, 2011

4 mobile apps 2 dev teams

1 enterprise mobile solution

Page 2: Enterprise Mobile UX Designing in Agile

Agenda

• Introduction• Decisions• User eXperience• App Design• Quality• Takeaways

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 3: Enterprise Mobile UX Designing in Agile

INTRODUCTION

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 4: Enterprise Mobile UX Designing in Agile

Kronos (??)

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 5: Enterprise Mobile UX Designing in Agile

Workforce Management

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 6: Enterprise Mobile UX Designing in Agile

Why Mobile?

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 7: Enterprise Mobile UX Designing in Agile

DECISIONS DECISIONS…

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 8: Enterprise Mobile UX Designing in Agile

Native or Mobile Browser

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 9: Enterprise Mobile UX Designing in Agile

Native App

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 10: Enterprise Mobile UX Designing in Agile

Mobile browser

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 11: Enterprise Mobile UX Designing in Agile

MOBILE PLATFORMSDecisions Decisions…

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 12: Enterprise Mobile UX Designing in Agile

Which Platform(s)

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 13: Enterprise Mobile UX Designing in Agile

Our Choice

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 14: Enterprise Mobile UX Designing in Agile

Which Devices

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 15: Enterprise Mobile UX Designing in Agile

Our Choice

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 16: Enterprise Mobile UX Designing in Agile
Page 17: Enterprise Mobile UX Designing in Agile

ENTERPRISE MOBILE APPSDecisions Decisions…

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 18: Enterprise Mobile UX Designing in Agile

Concept

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 19: Enterprise Mobile UX Designing in Agile

Client – Server Architecture

© 2011 KRONOS INCORPORATED I May 31, 2011

Server

Page 20: Enterprise Mobile UX Designing in Agile

Performance

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 21: Enterprise Mobile UX Designing in Agile

Response Time

© 2011 KRONOS INCORPORATED I May 31, 2011

Wi-Fi Wi-Fi/VPN 3G 3G w/VPN

iPhone

Android

Blackberry N/A

J2ME N/A N/A

0-3 secs 3-5 secs

Page 22: Enterprise Mobile UX Designing in Agile

Scalability

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 23: Enterprise Mobile UX Designing in Agile

Security

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 24: Enterprise Mobile UX Designing in Agile

USER EXPERIENCE…

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 25: Enterprise Mobile UX Designing in Agile

Goals

• Design for broad range of mobile devices• Consistency across products• Honor native UI models• Fast and simple• Ease of task completion

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 26: Enterprise Mobile UX Designing in Agile

Requirements

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 27: Enterprise Mobile UX Designing in Agile

Interaction Flow

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 28: Enterprise Mobile UX Designing in Agile

Design Studio

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 29: Enterprise Mobile UX Designing in Agile

Rapid Prototyping & Reviews

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 30: Enterprise Mobile UX Designing in Agile

Paper Prototype

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 31: Enterprise Mobile UX Designing in Agile

Prototype in a pocket

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 32: Enterprise Mobile UX Designing in Agile

got 5 min?

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 33: Enterprise Mobile UX Designing in Agile

SUS Questionnaire

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 34: Enterprise Mobile UX Designing in Agile

CONSISTENCYUser eXperience…

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 35: Enterprise Mobile UX Designing in Agile

Consistency

• Across app• Across platforms• Across enterprise product suite

© 2011 KRONOS INCORPORATED I May 31, 2011 s

Page 36: Enterprise Mobile UX Designing in Agile

Consistency

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 37: Enterprise Mobile UX Designing in Agile

Consistency

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 38: Enterprise Mobile UX Designing in Agile

Consistency

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 39: Enterprise Mobile UX Designing in Agile

Consistency

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 40: Enterprise Mobile UX Designing in Agile

Consistency

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 41: Enterprise Mobile UX Designing in Agile

APP DESIGN

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 42: Enterprise Mobile UX Designing in Agile

Staggered Development

© 2011 KRONOS INCORPORATED I May 31, 2011

Kickoff Code Freeze Quiet Period

Qualification, tail activities Quiet Period

Sprint’s

Device Porting

iPhone Development

Android Development

J2ME App Development

Blackberry Development

Design Process

Page 43: Enterprise Mobile UX Designing in Agile

Adobe Device Central

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 44: Enterprise Mobile UX Designing in Agile

Adobe Device Central

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 45: Enterprise Mobile UX Designing in Agile

Density Independence

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 46: Enterprise Mobile UX Designing in Agile

Density Independence

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 47: Enterprise Mobile UX Designing in Agile

9 Patch

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 48: Enterprise Mobile UX Designing in Agile

Collaboration

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 49: Enterprise Mobile UX Designing in Agile

Device Porting

© 2011 KRONOS INCORPORATED I May 31, 2011

Reference Device Certified Devices

Page 50: Enterprise Mobile UX Designing in Agile

QUALITY

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 51: Enterprise Mobile UX Designing in Agile

Heuristic Evaluation

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 52: Enterprise Mobile UX Designing in Agile

Formal Usability Evaluation

© 2011 KRONOS INCORPORATED I May 31, 2011

©Tobii Mobile Device Stand

Page 53: Enterprise Mobile UX Designing in Agile

Formal Usability Evaluation

© 2011 KRONOS INCORPORATED I May 31, 2011

©Looxcie Bluetooth Camcorder

Page 54: Enterprise Mobile UX Designing in Agile

Internationalization

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 55: Enterprise Mobile UX Designing in Agile

Internationalization

© 2011 KRONOS INCORPORATED I May 31, 2011

Screen Shots (different device language)

Page 56: Enterprise Mobile UX Designing in Agile

Internationalization

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 57: Enterprise Mobile UX Designing in Agile

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 58: Enterprise Mobile UX Designing in Agile

Useful links• Balsamiq• Adobe Device Central• Mobile Design Patterns• Mobile Phone Hi-Fi templates (PSDs)• Design4mobile• Design Guidelines

– Apple– Android– Blackberry– J2ME (Nokia)– LWUIT

• Twitter

© 2011 KRONOS INCORPORATED I May 31, 2011

Page 59: Enterprise Mobile UX Designing in Agile

© 2011 KRONOS INCORPORATED I May 31, 2011

Thank you !!!

More [email protected]

@vijju2k