fit cmobile rock-jethwa-w-audio-sep-2010-powerpoint

FITC Mobile|2010|Rock Jethwa|UX Designer|UX Architect ... [autoplay audio on each slide]


Home-OverviewHome-Overview

1) Bus. Reqs.1) Bus. Reqs.

2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals

4) Usability Testing


5) Business/UAT5) Business/UAT

6) Project Mgmt.6) Project Mgmt.

7) Teams/Reports7) Teams/Reports

8) Design Standards

8) Design Standards

From Newton to Now!

- A Collection of 15+ Years of Mobile UX and Usability Best Practices … to help guide your next gen Mobile app design and development.





2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards

Overview > 40+ Mobile Launches - Product Development - Product Ops





2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards

Overview >



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


***IN this space: -Roles/Responsibilities/Skills of UX Professional



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Working closely with business analysts, business sponsors, project managers and IT teams to obtain and understand business requirements.

Look Backward ... to Look Forward

Look at other professional disciplines...



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards



Blast from the Past ...

Source: Scott McLeod, Understanding Comics



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards



Thesis: Do old principles still apply?



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards



Blast from the Past ... 1993

Processor: ARM 610 (2oMHz)/StongArm 110 (162 MHz)Storage: 4MB/8MBMemory: 640K/4MB

Screen: 320x240 B&W/480x320 GreyscaleYears: 1994-1998



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards





2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


“Where do you start???”



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Bus. Req > Define Your Tasks

Source: CGE&Y



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Next Step: Observe UsersUser Interviews



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Bus. Reqs > Observe Users Ten Steps for Conducting a User Observation

1. Introduce yourself and describe the purpose of the observation (in very general terms).

2. Tell the participant that it’s OK to quit at any time.

3. Talk about the equipment in the room.

4. Explain how to think aloud.

5. Explain that you will not provide help.

6. Describe in general terms what the participant will be doing.

7. Ask if there are any questions before you start; then begin the observation.

8. During the observation, remember several pointers:

9. Conclude the observation.

10. Use the results.

Source: Newton 2.0 User Interface Guidelines



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards
















2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards









8. During the observation, remember several pointers.9. Conclude the observation.






2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards
















2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Don’t forget to observe real life...



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Bus. Reqs > Observe Users



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Outputs of User InterviewsUser Personas



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Bus. Reqs > Persona Development

Marketin

g

Brand &

Comm

unicatio

ns

IT/Engineering

Testing

Call Centre

Vendors/

Suppliers

Internal Training

Operatio

ns

Use cases - Share the vision

“The Soccer Mom” “But what this guy...?”

Source: Me



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Managing and creating the design of user interface specifications, by applying client research, design standards, industry best practices, taking into account strategic business objectives, user needs, systems constraints.



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Specs > UI Specs

Requirements DoneUX Design Can Now StartWireframes & Screenflows



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Specs > UI Specs

2nd-ary Nav

Top Nav

Menu List

Input Box

Create Wireframe Templates of Screen Flows

Source: Newton 2.0 User Interface Guidelines Source: Me

Consumers of WFs: These days it’s everyone. - Visual Information for Development



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Specs: Screen size and things on it



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Specs > Check the Screen Size

Portrait + Landscape



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Specs: Text, Meaning, Metaphors



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Specs > Text, Labels, Fonts

SMS - Why so Popular Still?- All the VALUE with ZERO effort of interactivity = AWESOME

Reason?: Cloud service comes to you instead of you going to the cloud service. - Cost Efficient

Titles>Lead the User Down a Nav Path


Ordinary title with icon

Ordinary title without icon

Subordinate view title—left-justified

No title—view’s contents make its purpose clear



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Leading the design review sessions with project teams, acquiring consensus and getting approvals on designs and documentation.



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Reviews/Approvals: Feedback from stakeholdersInnovation: Managing Product Features

Innovation: Managing Process Complexity



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Reviews/Approvals >



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Reviews/Approvals >

Skip this slide ...



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Leading usability testing when required, providing expert guidance to the project teams, creating test strategy/plans, test scenarios, screeners and facilitating usability testing as required.



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Usability Testing: New DevelopmentsEye Tracking



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Usability Testing > Eye Tracking

Source: Tobii



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Old School is cool too ...Paper Prototypes



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Source: Designing Interactions, Bill Moggridge

Usability Testing > Paper Prototypes



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Usability Testing: Change Blindness



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Usability Testing > Change Blindness - Recognition

Source: Ronald A. Rensink, University of British Columbia



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Creating and executing business acceptance test cases and testing for the GUI.



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


UAT > Don’t lose site of the big pictureThe Vision: Tasks together ...

Not just individual features/functions



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


UAT > User Task-Purchase Cycle

Yes, it is

about gettin

g

product out th

e door ...

But lose sight of why users want to

take the product into their homes &

lives in the first place...



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


UAT : Test everythingTest how they relate together

Criteria for each screen



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


UAT>Screen Components-Mental Model-Consistency of Approach

1. Title: Each screen should have a title bar.

2. Nav/Sub-Category: If the application uses categories to organize records, put a category pop-up list in the upperright corner.

3. Layout: Use the whole screen, all the way out to the edge.

4. Native Functions: Whenever possible, use the standard Palm OS user interface resources.

5. Alignment: Line up and left-justify command buttons along the bottom of the screen.

6. Spacing: In buttons and other places where text is contained in a border, be sure to leave at least one pixel above and one pixel below the height of the text.

Source: Professional Palm OS Programming



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


UAT > Confirming Specs



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Working with the project managers to ensure that usability deliverables accommodate project timelines, budgets, technical and scope constraints.



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Project ManagementProactive: Plan for change

Don’t panic when things change (it’s normal :)



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Changes in Version 2.0 (March 10, 1997)Features added to version 2.0 include the following:

❑ Scroll bars and associated functions for manipulating them ❑ New launch codes to support phone lookup and access to the system preferences panel ❑ TCP/IP support (only on devices with 1 MB RAM or more) ❑ IEEE floating-point math, including 32-bit floats and 64-bit doubles ❑ System-wide Graffiti reference dialog box ❑ New string manipulation functions

Features changed from those in earlier versions include the following: ❑ Application preferences ❑ System keyboard dialog box ❑ Edit categories dialog box

Changes in Version 3.0 (March 9,1998)Features added to version 3.0 include the following:

❑ IR beaming ❑ A large bold font ❑ Dynamic user interface functions ❑ Custom fonts ❑ Progress dialog manager ❑ Unique device ID on hardware with Flash ROM ❑ File streaming to support records larger than 64K ❑ Support for Standard MIDI Files (SMF) and asynchronous sound playback

Features changed from those in earlier versions include the following: ❑ Further changes to the edit categories dialog box ❑ Dynamic heap increased to 96K ❑ Storage RAM configured as a single heap instead of multiple 64K heaps ❑ Application launcher an actual application rather than system pop-up

Source: Professional Palm OS Programming

PM > “Keeping Up with the Jones” - Change Management

Especially in mobile, be ready for OS changes beyond your control : (



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


PM > Keep Good Habits - “Check-in” & Update



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Possibly working on several projects at a time and providing regular status reporting to manager on all projects.



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Interconnected World- Systems- Process

Traceability > Accuracy



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Team - Reports > Be Courteous, Update, Communicate

“Think Globally, Act Locally”

Weekly Status Reports

Multiple Projects

Multiple Time Zones

Managed Teams



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Contributing to the development, maintenance, and continuous improvement of efficient & effective usability methodology/process, documentation, workflow, ROI, metrics and design standards.



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Design - Standards > Metrics Do some research - Not Cool Aid

Don’t rely on “Silicon Valley Press Releases”



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Design - Standards > Metrics



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Design - Standards > Metrics

Design - Standards Always Changing >Now > Future

e.g. Hologram -NTT Docomo R&D



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


Design - Standards > Now > Future

Hologram Display-NTT Docomo-R&D Centre-Japan-2007



2) Specs2) Specs

3) Review/Approvals

3) Review/Approvals






8) Design Standards

8) Design Standards


nokia 3310sony watchman

boomboxpalm pilot

atari controllermtv logo

jvc camcordertabletop pacman

windows ce palmtopgameboy

zip driverio pmp-300 mp3 playersony walkmanrubiks cubemotorola startac phonedigital answering machine commodore 64apple quicktakereebok pump hi topsmotorola brick phoneapple newton

Thank YouThings we can learn from these days ...

fit cmobile rock-jethwa-w-audio-sep-2010-powerpoint

Technology

business analysts

business sponsors

business requirements

autoplay audio

project managers

slidehomeoverview1 bus

specs3 reviewapprovalslook

usability best practices