Stride
We are overloded with information from all around who deprive us of attention and leave us with little focus. Yet, we would like to catchup with the important news about our favorite icon from business, sports or movies.
I was part of this exciting project to build a simplistic app which delivers the updates with no distractions, accessible in real time and all in one place.
My role
I took 3 responsibilities for this project. It was challenging yet fun playing the key roles for this internal project.
I had to define the problem, fix the scope of the project, set timelines and give the direction for the solution.
I had to explore the persona, work on the user journey and flow, design wireframes for the solution.
I had to design the mockups, detailed design of the solution and present style guides to the developer.
Spandana my colleague, was the iOS developer. Thanks to her efficient programming, we could achieve to plugin twitter and facebook apps and create a stream within 24 hours. Abin was our test engineer.
THE CHALLENGE
Information overload
We resort to social media platforms like twitter, facebook, instagram to get our daily dose of news, updates from our favorite brands or celebrities apart from our friends.
However, we get distracted by news about lot more other topics which wastes a lot of our time browsing. It will leave us consume a lot of unwanted information as a side effect.
Also, we might have to check multiple apps to grasp complete information about the topic of our interest.
This is a big challenge of regaining our time and attention swimming through the information clutter.
PERSONA
Millenial
Our ideal user is a milennial and who is working. She likes to know about her favorite founder Elon Musk. And tries to know the updates about him every morning before going to work.
She currently juggles between a bunch of apps like news, twitter, facebook, instagram to read what all the sources are reporting about Elon Musk.
She unknowingly ends up spending too much time and misses the
early morning train to work. While having discussions with her colleagues yet she feels missed out on one particular update. She ends up digging more from all the unwanted news and wastes more time.
CONSTRAINTS
Applying limits
We wanted to restrict the number of brands/celebrities our user can follow, as following too many people will defeat the whole purpose. Also we wanted to restrict on the number of streams from which we source the news to avoid engineering overhead.
VISION
Simplify
We wanted to make application very simple and usable. The user should be able to find the brands or celebrities original profile easily and not get drowned with all the duplicate ones.
Also, I wanted the interface to be simple with minimal design because I wanted the user focus to be on the information and not have distractive fancy design.
THE PRODUCT
Stride
A simple unified stream of information of your favorite brand or celebrity from multiple sources.
FRAMEWORK
Design sprint
As it was an internal project, we wanted to approach with a very lean method. We followed a design sprint way of solving this problem.
We grouped ourselves into a room (pod) and set up a board to think about the problem, define the user goals, ask lot of questions to each other and be
able to come to the solution quickly.
The engineers broke the problem into modules and came up with a working prototype, an MVP.
Meanwhile I could work on the user flow, draw sketches and design an interface.
WHAT IS NEW?
Conversational Interface
I was clear in my mind that this application is going to be simple and as minimal as possible.
I wanted to maintained a vanilla design language for the app without using many colors.
I wanted the interface to be humane.
Like almost chatting with a real person, while signing up and searching for celebrities and following them.
MODULES
User scenarios
After brainstorming and discussions with engineers, I came up with a basic workflow consisting of 6 steps
Login and plugging in social media apps
User flow while login in or plugging social media apps
plugging facebook app
pluggin twitter app
User needs to give access from respective facebook and twitter accounts.
However they have a choice to choose both or only one source.
Searching for brand or celebrities
Searching for celebrity or brand on first launch
Following
Searching for another celebrity and following
Reached limit and unfollowing
User flow when a limit of following is reached
Searching for another celebrity and following
Limit is reached and hence cannot follow more
Option to unfollow existing celebrity when limit is reached
Accessing feed
Viewing feed with video
Viewing feed with an image
Unplugging
Unplugging the app
FINALIZING
Style guides
Being an interaction designer, I rarely got a chance to work on the visual design and provide developers the assets at multiple resolutions.
It was very exciting and I learned a lot during this exercise.
Finally, we could complete the app with full functionality, test it with mutliple users and launched on the app store.
It was an enriching experience to work closely with the developers and playing the role of a product owner.
I could make many decisions which I didn’t feel not only right but could justify in discussions with the team.
It was great to think from the user perspective and no app is good till users love it and own it.
We did test it with few users and collected feedback and incorporated into the app.
Specifications for developers
Screenshots from realtime
LEARNING
Dealing with multimedia
When dealing with media, we need to consider the download sizes, internet speeds for streaming etc.
In the first iteration, we didn’t optimize for the speed.
This was causing an unusual delay in loading the media as most of the users complained. We could rectify it by
compressing the images and videos using other formats suitable for web.
Also from the design perspective, I had to create placeholders and micro-interactions till the images or video is loaded.