chitchat mobile is a phone usage management app concept which focuses on helping customers of chitchat manage their account on their phone. It was designed as part of Alphero's Design Day Bootcamp 2016. Our team gained 1st place in the ChitChat brief category and 2nd overall in the competition out of 9 competing teams.
Event: Alphero Design Day Hackfest    |    Development Time: 6 August 2016 (6 hours) + 7 days refinement    |    My Role: UX/UI Designer



I worked as a UX/UI Designer and Team Lead on this project. The purpose of this project was to give Summer of Tech program students the opportunity to work a day in the life of agency, Alphero. For this event, I teamed together with 2 other designers: Ayesha Munaf (UX Designer) and Emma Selley (Content Management & Design Research).

Challenge
chitchat is a mobile phone company (fictional, but based on an existing company) in the UK. The aim was to design an application for chitchat customers to easily manage their account on the go. Features of the application allowed users to: View their current usage - minutes, texts and data, pay and top up their account on the go, manage their add-ons and other plan extras and access an exclusive “special something” for the user. 

Outcome
The target audience for this application was “tech savvy students and young professionals ” between the ages of 19 to 34. The client stated that we had to consider that the users would most likely be using data rather than text or minutes.




User Research 
During the first hour in the hackathon, we looked at understanding the target users and their reasons to why they would choose chitchat vs any other mobile provider. We also researched the problems and frustrations users would have with their current service. Although the target audience is tech savvy students and young professionals, we also took into consideration secondary users who fitted outside of this area. This was taken into consideration as there are still users within the primary target audience who rarely (or did not use) data provided in their given plans.


Competitive Analysis
In our design pack given at the bootcamp, we were given a list of ChitChat competitors including: 2 Degrees, Skinny, Spark and Vodafone. Included alongside the competitors was an analysis of app observations and issues with their own mobile usage management apps. With the information given, I created a side by side comparison of the competitors to learn what features benefited each app or hindered the user while using it.
Information Architecture
I created a site flow for the application to help figure out what pages we needed for the application and what could be designed in the time frame given. 



Sketches & Lo-fidelity Wireframes
I gave myself 9 sets of 30 seconds to sketch and iterate variations of  layouts. For every 30 seconds, I needed to have sketched out a different wireframe. While I was looking at the other competitors, I wanted to create a layout that was not just a set of progress bars in the form of lines or circles, but something that helped to emphasise the important information the user needed to know. I later refined the wireframes when I decided to look over the UI again (after the end of the bootcamp).



Hi-fidelity Wireframes
On completion of the six-hour hackfest, our team came out with these designs. Although we placed 1st in our category and 2nd overall, I wasn’t satisfied with the final User Interface (due to rushing in the last two hours) and did not feel quite as 'complete' as I was hoping.


___________________________________________________________________________________________________________________

Final Outcome
After the end of the one-day boot camp, I went back in my own time to polish each of the concepts based on the feedback given to us by the hackfest judges. I spent a bit of time tweaking the overall look, feel and flow of the app - however, most of the User Experience elements stayed the same.




Prototype
Here is a clickable prototype I created on MarvelApp to demonstrate some of the interactions.
Unfortunately, due to no "dragging" capabilities, the "drag and drop" feature is currently a click for this prototype.




What I learnt
My biggest takeaway from designing chitchat was how to design and conceptualise quickly within a small time frame. It made me realise how much time I normally take to get my head around an idea and how to expand those ideas in the best way possible. This helped me to start forming the baseline to my creative process and to help guide me and my future teams in future projects. I also learnt how to direct a team of theoretical designers who did not have as much experience with product or interface design and to help to adapt their skills for this mobile design concept. In addition, I learnt how to use Sketchapp for the first time and am looking forward to using it as one of my main design tools for future projects. Although I wasn't originally happy with the original 6-hour outcome, I was quite pleased how well the concept improved during post-refinement.

___________________________________________________________________________________________________________________

Credits
EVENT HOSTS
Alphero
Summer of Tech

DESIGN TEAM
Rosanina Estrella
Ayesha Munaf
Emma Selley


MENTOR
Nick Guthrie

You may also like

Back to Top