Tuesday, February 11, 2014

Mobile App Design Process (02/11/14)

This week I continue to work on re-designing the New York Tides App.
I was to develop information architecture and wireframes.


Before I started my own work I did some research.


Behance.net gave an in depth look at the mobile app design process.
Steps: Research; Plan; Design; Build; Evaluate; Visual Design.
Interesting that visual design is last.The Mind Map is very detailed with information on all the steps that need to be analyzed, including the economics like per capita income. I was not familiar with a SWOT Analysis:  Strengths, Weakness, Opportunity, and Threats. I found out it is structured planning method for business strategy.
The presentation  of the steps is very clear and useful.


I went on to read the uxbooth.com article "Beginner's Guide to I.A. It is quoted as saying that the use of information archetecture is ”creating structures to facilitate effective communication.”
Questions: What is the flow of users through our site? How does the software help the user catalog their information? How is that presented back to the user? Is that information helping the customer (i.e.: decision driving)?  The I.A. professional is not merely presenting information attractively, but is ensuring that a user gets what they need from the site and is getting what the designer wants them to get. One quote mentions that a bank web site not only gives information about a customer’s accounts but also gives “security”. The website wants the customer to feel that the bank is protecting them and their money.
The IA needs to have the big picture that crosses or combines several disciplines, designer, project managers, graphic designers. They maintain the vision that ties all the elements of a project together seamlessly. They are only necessary on large projects that manage huge amounts of data in an unusual way. The Project Manager normally fills the role of IA.


IA’s research the audience and business. Decide on the sites primary objective and design or influence the design.


IA’s primary tools are wireframes. There are many tools available to produce wireframes, Visio and OmniGraffle are two of the best.


Dan Klyn video equates how a good building functions well because an architect designed it to. IA is the same, a good web site works because an IA designs it well.  


Reading this made me ready to design my own information architecture for my site.


The uxbooth.com article, “Designing for Mobile Part I” states that there are 6 billion mobile subscribers in the world, 87% of the world’s population 7 out of 8 people. We love our phones. But since they are small and may have slower connections, the design for mobile devices is different. User-centered deign is essential.  The four most popular design methods are: mobile-specific site, a responsive site (that automatically adjusts to the mobile platform), native apps or hybrid apps. Native apps are designed for the device, hybrid are more flexible and give an “app-like” experience.  Each method has its pros and cons but the chart seems to show that responsive sites are the most useful.  



Now is time to get to work. After researching my users I began to design my information archetecture by using a hieracharcy pattern. I thought about what information a user would need.



Next, I began to sketch the wireframes. I laid out the different navigation tools that I thought would be the most efficient way to present my information to my users. I gave a lot of thought how the users would navigate the site.


Sources
Ghodke, Swapnil. “Mobile Application for Job-seekers.” behance.net. N.p., 17 Nov. 2013. Web. 9 Feb. 2014.
Maier, Andrew. “Complete Beginner’s Guide to Information Architecture.” uxbooth. N.p., 10 Mar. 2009. Web. 9 Feb. 2014.
McVicar, Elaine. “Designing for Mobile Part I: Information Architecture.” uxbooth. N.p., 25 Sept. 2012. Web. 9 Feb. 2014.

No comments:

Post a Comment