I took up a project to help me put a structure to how I would build the UX plus understand the various aspects linked to it, if I needed to start working on an mobile app from scratch.
An app to control the carbon footprint in your home
As i went through the project, I chose to work on building an app that would help users to monitor and control the carbon footprint of their homes. As internet of things takes off, this should be one of the obvious problem-solutions that will play out in the world. The app would allow users to manage all energy consuming devices, monitor and reduce carbon footprint and finally share related data / stats with one’s social group.
The project is built in the context of Android OS.
Here is the link http://prezi.com/9f0q5izipkx4/green-home/
If you like what you see and would be interested in helping me convert it into reality, let me know 🙂
Working on the project help me get some understanding on how to a) start thinking of the user, his profile, needs and ultimately reach the wire-framing stage b) understand the possibilities and limitations of the android platform and leverage those to improve the UX.
Going from users to wire-framing – PUFFF
Steps to working on building the user experience for your mobile platform. I could discern 5 key steps to this process which can be summed up by the acronym PUFFF.
PUFFF – persona => use case => feature list => flow (low res) => flow (high res)
Persona – mobile persona / desktop persona. (Mobile persona incorporates mobile device constraints).
Constraints on mobile
1. Finite battery / finite data
2. Divided attention
The user often multi-tasks when using a mobile device (crossing the street / having a coffee / working on his desktop etc.). In such a scenario, the app must allow quick actions with minimum finger strokes (e.g actions within notifications to avoid forcing the user to launch the app to handle alert related actions).
3. Handedness – There are multiple ways user use their hands to use the mobile device. This leads to certain accepted guidelines to optimize the user’s experience.
Ow zone is the area on the mobile device that is typically hard to reach. 50% usage on the device happens with one hand. There are multiple ways to use a phone – single handed, double handed (e.g when texting), cradling i.e holding in one, operating with other (e.g browsing).
This post is a excellent summary on the related issues http://scotthurff.com/posts/how-to-design-for-thumbs-in-the-era-of-huge-screens
4. Small screen.
4a Usual problems
i. Excessive line lengths (ideal to keep between 45 to 75 characters per line)
ii Unbalanced content
iii Not making use of full real estate
4b Key solution is to design responsive sites. Three techniques
i Combination – e.g combine a list on LHS with detailed view on larger device compared to only list on small device.
ii Macro reflow – e.g moving vertically stacked up header image and body text to horizontal stacking on either a large device or in horizontal mode.
iii Micro reflow. e.g shifting from list to grid beyond certain device size. Or introducing margins when content is too sparse to give a balanced view on a large screen size.
5. Patchy data connection
Inputs available on desktop vs mobile
– Inputs available on web / desktop – text / pointing device
– Inputs available on android over the web – light sensor, accelerometer, gyroscope, fingerprint,
Leverage the context of user on mobile
– what is he doing?
– where is he? (longitude / latitude),
– who or what are the near? place – mall, shop etc,
– who is the user (e.g google + identity)
Android APIs
Leverage Google Play APIs for android to build great user experiences
https://developer.android.com/google/index.html
These include
– google plus / wallet / drive / maps / in app billing / GA / google mobile ads / games / location / Cast / cloud messaging / google play distribution /
Use the Android APIs judiciously
While using android APIs. keep two objectives in mind
– be purposeful – use an API / feature only if it serves a purpose.
– be respectful – use APIs / features, to delight user. Dont creep him out.
Credits: I did this project in 2014 as part of the Udacity course, ‘UX Design for Mobile Developers’, which was co-created by Google. Thanks to the instructors: Nazmul Idris & Izabel Grey.
