Monday, July 28, 2014

How to design wireframes for APP


Learnt:
1. Designing wireframes is a very important skill for startup.
2. UX Design is to essentially resolve the business problems for business users.
3.

Diagrams:
Flowchart, Wireframes, Mockups

Goal of Wireframes:
1. Design the solution to solve user's problems
2. Design good user experience, so users will like your design and use them.

Tool:
Omnigraffle, Omnigraffle Stencile, Konigi Wireframe Stencils

Omnigraffle Stenciles:
Konigi Wireframe Stencils
iOS 7 IPhone Stencils by Sourcebits

Links:
http://zurb.com/playground/iphone-stencils


Knowledge Sharing:
1. One way to capture the output of this design process is with flow charts and wireframes. A high level flow chart for a web app (or any software application for that matter) explains the functionality of the application and how you get to each part of the application at a glance.
2. A website wireframe, also known as a page schematic or screen blueprint, is a visual guide that represents the skeletal framework of a website. The wireframe depicts the page layout or arrangement of the website’s content, including interface elements and navigational systems, and how they work together. The wireframe usually lacks typographic style, color, or graphics, since the main focus lies in functionality, behavior, and priority of content. In other words, it focuses on “what a screen does, not what it looks like.” Wireframes can be pencil drawings or sketches on a whiteboard, or produced by means of a broad array of free or commercial software applications.
3. Website wireframes are 90% thinking/planning and just 10% drawing
4.


Good UX APP:
Twitter
Duo Mi



References:
http://startupworks.co/blog/2014/03/07/top-5-online-wireframing-tools-for-startups/
http://startupmusings.wordpress.com/tag/wireframe/





No comments:

Post a Comment