mobile app design

29
Mobile App Design -- Deepak Modak @deepakmodak

Upload: deepak-modak

Post on 05-Dec-2014

445 views

Category:

Documents


2 download

DESCRIPTION

This presentation covers basic design principles, need of mobile app, challenges,design paradigms and tools. It contains exhaustive list of design tools which helps designer to speed up the workflow ,to make the right design and better UI.

TRANSCRIPT

Page 1: Mobile App Design

Mobile App Design

-- Deepak Modak @deepakmodak

Page 2: Mobile App Design

Recognizing the need is the primary condition for design. -- Charles Eames

Page 3: Mobile App Design

Why Mobile App ?

•Mobile devices are always on•Encourages immediate response from the

user •Mobile devices are popular•It is more personal•Easy access

Page 4: Mobile App Design

What Challenges ?

•Small screen size•Difficult to type•Battery life•On the go•Hard to multi-task•Data transfer for slow connections•Partial attention while babysitting

/walking

Page 5: Mobile App Design

Design Thinking

Viability (Business)

Feasibility (Technical )

Desirability(Human) Innovation

Page 6: Mobile App Design

Design Paradigm

Less is moreInclude the important featuresOne action or max two at a time

Page 7: Mobile App Design

Design Paradigm

Design of thumb75% of people use thumb to navigate

Page 8: Mobile App Design

Design Paradigm

Clear & Focus PresentationUse of iconsColorInfo-graph‘How to get started’ screens

Page 9: Mobile App Design

Design Paradigm

Gestures are quickerPinch swipe Max use of handHand zoom in/out

Page 10: Mobile App Design

App Design Tools

Page 11: Mobile App Design

Affinity diagram A creative process used for gathering and organizing large

amountsof data, ideas and insights by evidencing their natural

correlations.

It starts with a statement of the problem or the goal, each participant think of ideas and write them on small pieces of paper (cards or stickers). Then those cards would become the physical instrument to work on their contents, find the correlations and identify the significant groups of sense. The result is a sort of verbal and visual representation describing the first exploration of design solutions.

Page 12: Mobile App Design

Affinity diagram 

Page 13: Mobile App Design

Mind Map

•A mind map is a diagram used to visually outline information.

•It is often created around a single entity placed in the center , to which associated ideas, words and concepts are added.

Page 14: Mobile App Design

Mind Map

Page 15: Mobile App Design

MoodBoard

•A mood board is typically a combination of images, fonts, colors, and textures that define the style of the project

Page 16: Mobile App Design

MoodBoard

Page 17: Mobile App Design

Personas

•The personas are archetypes built after an exhaustive observation of the potential users.

•Personas are fictitious , but they are based on knowledge of real users.

•Understanding your audience is essential to building great products.

Page 18: Mobile App Design

Personas

1. http://www.ux-lady.com/introduction-to-user-personas/

2. http://www.ux-lady.com/diy-user-personas/

3. http://marketingbeforefunding.com/2013/02/26/complete-guide-to-creating-a-customer-persona-for-your-startup/

[1][2]

[3]

Page 19: Mobile App Design

Interaction Design

•How users behave in the application like navigation

•If your user does something, your app needs to acknowledge the interaction instantly i.e. responsiveness

Page 20: Mobile App Design

Interaction Design

Page 21: Mobile App Design

Visual Design

•Focuses on the aesthetics of an app and its related materials by strategically implementing images, colors, fonts, and other elements.

•Placed on the top of Interaction design

Page 22: Mobile App Design

Visual Design

Page 23: Mobile App Design

Other Useful Tools

Page 24: Mobile App Design

Facebook Origami

Page 25: Mobile App Design

Other Useful Tools

Page 26: Mobile App Design

Resources

Page 27: Mobile App Design

Common Bad Habits

•Not thumb friendly•Not using full screen concentrating only

on particular section top/bottom•Cluttered information on single screen•Not applying The Golden Ratio in Designs•Lack of proper information hierarchy •Unclear entry and exit point

Page 28: Mobile App Design

Useful Links

• http://bit.ly/AndroidDesignInAction

• http://bit.ly/DevAppsDirect

• http://bit.ly/AwesomeAndroidDesign

• http://androiduiux.com/author/taylorling/

• https://www.google.com/events/io

• http://androidniceties.tumblr.com

Page 29: Mobile App Design

Simplicity is the ultimate sophistication. -- Steve Jobs

Thank You