Introducing ‘GlanZ. Your day at a glance’. A Capstone Project.
In this post I’ll introduce my Capstone Project at the Interaction Design Specialization by University of California, San Diego, via Coursera. It’s a prototype of a mobile app.
I started this specialization on the summer of 2015 to learn about the design field, though I had done some UX design before even knowing it was called that way. During all this time I’ve been balancing studying this specialization (made of 7 courses plus the capstone project) with my startup, some freelance and company jobs, and other courses. It’s been tough.
The App
Nowadays, we are all connected through our smartphones to lots of sources of information and the border between our personal and professional lives is blurred. We are constantly receiving information and this damages our productivity. If this is added to our overwhelming list of things to do at work, we can get paralyzed without even knowing where to start.
GlanZ is designed to help professionals organize their workday easily and quickly. Whether it is right after waking up, having breakfast or arriving at the office, with just a glance at the mobile app, everyone can know what they have for that day and decide the next steps he/she wants to take.
The app is not designed as an all-in-one management app, so if the user wants to se an email, tweet or whatever, once the item is tapped the original app will be opened.
Emails, tasks, appointments, news, social media, bank…and many more apps can be integrated so that the user can see the most important (and urgent) things that must be managed and organize to start working. With an easy to see dashboard and intuitive navigation, the user can get a sense of what is going on that day and get things done.
Here you can see the prototype. And a video:
The Process
The Capstone Project has been a 9 week journey in which we’ve been doing different assignments in order to develop a prototype. It has followed the Design Thinking methodology (although the titles of the assignments don’t match exactly) which goes through the following stages:
At first we had to choose one design brief out of 3 options: glance, time and change. I chose glance, which was defined this way:
We are surrounded by information. Some might even call it overload. How might technology show us the essential pieces at a glance, so we can quickly navigate through the noise to get to what we really want? We compulsively check email, Twitter, Facebook, and the news — — just in case there’s something there. Right now we are doing the filtering and finding ourselves, why not let our devices do it for us? How can a screen summarize information and present just the most relevant parts (especially if it is tiny)? How can these devices use social and physical context to more effectively have the key information ready at a glance? Today the home screen of many devices is a grid of icons, or a static picture. That’s not very creative. You can do way better!
Your Mission: Find people and design a personal dashboard tailored to their needs.
With that in mind, the journey started…
Needfinding
The next step was to observe real people in their lives and interviewing them to find design opportunities. I focused on professionals and how they manage all the information they use at work and how they get organized, specially at the beginning of their workday.
How many information sources do they check when starting to work? How many apps do they have a look at? How do they decide what to start with? How do they organize the rest of the day?
Observing in real situations helped answer those questions. With the answers came the time to brainstorm ideas…
Ideation
After organizing all the information gathered from various people with different jobs and needs, a list of generic user needs came out. And these needs lead to a Point of View, which in my case I defined as:
“Professionals make use of lots of information resources nowadays, such as communication apps. Getting a sense of the latest activity of interest and the upcoming events (tasks, appointments) must be easy to visualize and get a sense of ‘what’s going on’ in order to decide and organize the work time.”
Having a clear point of view from the beginning is very helpful in order to start with the design phase. To complement it, I constructed an inspiration board with a list of words related to the point of view and some designs that I liked from related and non related fields. Some of my inspiring words were: scan, quickly, tided, organized, simple…and some designs are shown in the next image
Prototypes
Once the mission and the point of view were clear, the next step was to build some prototypes, going from low to high fidelity, from paper to bits…
Before getting to think (and draw) any interfaces, I started establishing the scenarios in which the app was going to be used and the outcome that it should produce. This was done with storyboard, which is a great tool to help visualizing from a user perspective.
Along with the storyboards, I started to sketch the interface of the app with paper prototypes:
Testing
And with the paper prototypes in hand we can start to get feedback really quick and cheaply…
The first steps were used to perform Heuristic Evaluations of the design with the help of potential users interacting with the papers as if it was a real app and from our peers (Thanks a lot Swati and Bram!).
Iterating prototype > test
From here on, I went through several iterations polishing the design according to the feedback received from the users and increasing the fidelity with more details.
After improving the paper prototype, a basic wireframe of the UI and a development plan for the whole prototype were created (using Keynote and Google Sheets). With the plan defined I started creating the prototype (with InVision) starting with the main navigation and adding more detail and functionality afterwards.
Once a first version of the complete interactive prototype was created, came time to test it…
In order to perform the tests, I had to define the tasks the user should achieve with the app. To kind of tests were done, with a redesign phase in between. First some potential users tried the app following a testing protocol so each time the test was the same (and signing a consent form).
After learning from this users, an online test was designed to A/B test some part of the app. In my case I was worried about the navigability of the app and changed the design of some elements that aren’t clickable (or tappable) and adding a navigation tip. This test was performed via UserTesting.com having 4 users in total, 2 trying each prototype.
The feedback received from these tests showed that the app was very easy to use and intuitive. I also learned that some changes had to be performed improving the settings options and some details of the information displayed on the app (time format and due dates of the tasks). I was very happy to find out that my main concern of designing a simple, organized and easy to use app was achieved and I only had to final polish some details learned from the users’ feedback and add others that I hadn’t taken into account until that moment.
So, after all this process, I arrived to the end of this specialization. It’s been a long journey with many hours of hard work that have led me to learn a lot of a very interesting field as is the Interaction Design. I want to thank Corusera and all the staff for creating this MOOC and being able to access it from very far away.
Maybe next step is programming the App with Ionic Framework and see if people user it.
Thank you for reading! And happy design…
