TV Guide App Design — ‘tvito’ — a User Experience Design Project.
This project is a part of my Interaction Design Specialization program from UC San Diego offered through Coursera. Check out this Coursera course here.
Have you wasted time just scrolling through content on Netflix and switching between multiple streaming apps? But still unable to decide what to watch.
After all the efforts or getting a suggestion from a friend, you watched an amazing movie, and now you want to tell your friends about it and discuss it. But the group chat discussions on the movies and TV shows always deflect.
This TV Guide app will act as a central hub for all your streaming apps and help you in decision-making by providing you limited but the best-suited options. On 1 tap you’ll get all the required information such as ratings, reviews, where to watch & you can also plan when and what to watch.
User Challenges:
- Sync all streaming apps and get the most out of your subscription
- Deciding what to watch
- Need a system to manage the movie watchlist.
- Need a dedicated place to discuss TV shows/Movies privately
Specification: App design for iPhone — size 414 x 736 pixels
Timeline: 04 Weeks
Following was my step by step approach for this app design project:
After interviewing the 3 participants I felt the users need a tool that will make their TV viewing experience much better for them. The interviewees talked about their frustrations and work-around to come over the confusion caused by the multiple streaming apps and endless content availability. The struggle for self-exploration on movies/shows is real and the users waste a good amount of time just scrolling through the content titles on these apps. The decision-making process is lengthy due to switching between apps and then figuring out what to watch or remembering what your friends recommended.
Using the brainstorming technique I learned in module 5, I came up with 15 ideas to make the user’s TV viewing experience better.
Performed comparative analysis to narrow down the features to produce a minimum viable product. Competitive analysis was performed on the following:
• ‘TV Listings’ app on iOS Appstore
• Apple TV device
• ‘TV Guide’ app on iOS Appstore
• Amazon Fire TV
From my ideation/features list, I took 2 user stories and prepared storyboards.
User Story 1: As a TV viewer, I want to sync all my TV Streaming apps so that I can decide what I can watch from the available content for me
User Story 2: As a user, I want to share and discuss the movie I watched so that I can feel more connected with my friends and also promote good content.
Storyboard 1 & 2:
The project scope specifically asked for Paper Prototype. I had a fun time applying my craft skills to prepare the buttons and dropdown menus.
Asked a friend to perform Heuristic Evaluation on my Paper Prototype.
Considering the set project guidelines and timeline, I used the user flow and layout structure from my paper prototype and started working on a Medium Fidelity prototype using Adobe XD.
Keeping it simple I kept the ‘TV’ in the name therefore I finalized on ‘tvito’. The lowercase in the logo makes it friendly and fun. I used orange and yellow in the logo to indicate summertime freshness and fun. Font Typeface — Axiforma family. Yellow, Orange & Purple, and Grey Hues for the font.
After self-assessment on 2 iterations of the medium-fidelity prototype, I asked a friend to test the app and got some valuable feedback. On the main content display page for movies/TV shows, I worked on organizing the carousel and design of the content. The user mentioned that they didn’t know they were only provided with 3 options in each category.
Users also mentioned that there should be other ways to look for content options. I asked the user further and they mentioned having flexibility and fun element while doing it. So, I decided to add a fun element — ‘spin the wheel’ and provide them with a random movie option. Since these are the added feature, I made a separate page or tab, and called it ‘assist’, and added a banner image — ‘help me find’ to intrigue users.
“This is really good. Seeing all different apps takes a lot of time when you watch a movie and most of the time you forget to check certain ones. So it's a really good app actually. I’d use it.” — Arnav (Friend)
I conducted online A/B testing on usertesting.com with unknown users. Since I wanted to get the results quicker, I only had 1 screening question to keep my participant range broad–
“Do you use multiple streaming apps (like Netflix, Hulu, HBO Go, etc.) on your TV?
I was thrilled to see and hear what users say about my app. One of the users also narrated her situation when she and her friend got together to watch TV but got confused and ended up wasting time just surfing through the endless options. One user spent almost an hour analyzing everything including the name of my app, colors used, fonts, and textual copy. The option B that I designed was not quite the favorite as it confused them, but I also think that might have happened because I didn’t add any system status screen for them to show the change. I also realized the flow that I thought would work for all users was not accurate. Some users lost their way and could not complete a few tasks. I assumed that the users would naturally tap on the logo icon to go back to the main screen/home page of the app but that didn’t happen at all. One of the users also complained about not having options easily available at any time during their journey. Certain options like ‘Help me find’ and ‘Explore your content’ were only available on the home page of the app. 3 out of 4 users said they liked the app and would recommend it to their friends. The users saw the app as a solution to their decision-making problem for their tv viewing experience. I got great insights from all 4 testers which will help in improving the usability of the app.
I have implemented the user feedback from the online user testing in my latest prototype. The following Product presentation video on YouTube contains my final prototype.
Connect with me on LinkedIn and Twitter
Let me know your thoughts in the comments. I’d love to read and learn more.
I’d appreciate your claps if you liked what you read. 👏👏👏
Thank you for your time! 😊🙌
