Review Shack

Review Shack is a Movie and TV Review App which provides a platform for movie and TV buffs to share their views and read about other people's opinions about any movie or TV show. 

Overview

Now more than ever there are Movies and TV Shows accessible to people and are in such an abundance with people dying to know which movies and shows are good so as to invest their time in that. Review Shack is a mobile app which provides a platform for people to go write and read reviews about the latest content and share it with everyone to develop an audience or just for some casual writing and reading.

Role

I was doing this project while completing my course for Coursera on Visual Elements of interface design and UX Fundamentals. The main aim of my project was to understand and apply the user experience knowledge that I gained from this course and make a full blown mobile application.

Duration

July 2019

4 Weeks for the ideation to high-fidelity mockups for the project.

Skills

User experience and Visual Design.

Adobe Xd, Adobe Illustrator, Adobe After Effects, Optimal Workshop

Users and Audience

Information Architecture

Having established the target audience, the next step was to decide the user flow and make the content and interaction map for the app.

I started with making the content map, this helped me to decide and understand the different pages and screen the app would be comprised of and the things to put on these pages.

After I decided on a content map, I moved on to decide the discussions the users will make and how the flow though the app would be. 

Sketches and Paper Prototypes

With all these cool features I had planned out in my head, I had to sort them into steps outlining a smooth flow that would be intuitive to first-time users. So I started off this process by writing the ideas I already had and then just let the ideas flow onto the paper.

Laying down the designs provides me some perspective and the basis on which the wireframes and the high-fidelity mockups would be based upon.

Wireframes

After I had put out the basic idea on paper through the sketches, I made a mid fidelity prototype so as to decide on an actual sized screen where all the components would fit and how they will look on multiple screens. This is also done so I have a basic digital layout for me to work ahead and understand how I’ll layout and design the final and high fidelity prototype.

After I completed the basic wireframes, now it was time to decide the visual asthetics of the app and what would be the visual feel of the app. For this I like to go on to different places like Behance, Dribbble, Pinterest and even google images to look for reference and save some I like and try to give a unique feel and visual to my project.  

High - fidelity Prototypes

For the interface of the App I thought of a clean layout as the reviews are the key focus of the app and not to overpower it with too many design element.

I came up with high-fidelity prototypes after a round of tests. Here are a few interfaces that I made by Adobe Xd. I designed all illustrations the workflow based on the data I had.

HOMEPAGE : For the homepage, I decided to show not only the reviews from the people that are following you but also the different reviews that are trending currently through the app. The following list has cards which provide information like the writer, movie/TV show and the time of posting. The app will have light and dark themes so as to suit the reader according to lighting around the person and whichever suits them the best.
SEARCH : The search page has various categories so to search anything is very easy and and can be filtered very conveniently. On the opening search page there are recommended reviews according to your reads. There is also a carousel for the categories. The search has categories among itself and can be done according to name of the movie/TV show, critic or reviews.
WRITE REVIEWS : Writing reports is a probably the most important part of the app, while writing the user must select a movie or TV show and then write the review. The app provides options to make text bold, italics, underline or strike through.
READ REVIEWS : The read review page must provide the user with a great reading experience, being able to easily read the reviews without any difficulty. 
USER PROFILE : This page provides the user or the person searching for someone, it gives the complete details about user from a basic bio to reviews written by the person.
USER INTERACTIONS: User interaction is a very important part of the user experience, these interactions are what makes the experience lasting and thus these are some basic interaction which continue the clean design with some basic smooth transitions for the reviews and navigation bar.

Outcomes and Lessons

This project was a very interesting one as I was able to apply and understand practically what I had taken away from the course and this app was rather more interesting as the complete idea to the end result was only me and trying to understand, plan and execute the design was really a very nice learning experience for me. 

After I had laid down the basic idea and the goals of the project, I now had to find the target audience and vibe of my application. I had a survey on Optimal Workshop to understand that whether people would use the app and the age group. The personas are made according to user research from a film school and the people I thought would use this app. I narrowed the users down to two major personas.