E-Sport Update, News, Community Application— A UX/UI Case Study
This case study is the result of the challenge from RevivalTV
Project Brief
The goal was to make a community-based experience particularly in the field of e-sport where users can find news, posts, community and others related to e-sport. The topic they choose and also provide an entertaining experience so they can enjoy the application and involved as a community.
This is a personal project from RevivalTV to me to show my design skills.
Context
As communities are a great way to be updated with upcoming news update or events but it also is a great way to connect with people and e-sport enthusiast directly.
Research
I started by gathering a few inspirations and references for community-based apps that are already available in the field to understand the structure of the app that I am looking for the community tab.
I followed the iteration method to come up with possible outputs and achieve the goal.
I also researched to find out the target audience for the app and found that about 80% of user were looking for healthier game community.
Competitive analysis
I looked a bunch of sites e-sport portal and news sites and apps to come up with what type of information user might need.
During the process, I came to know that many games have relations such as game updates, playgame meta, game update, news, and e-sport news related to competitive game which user would love to see, so I decided to implement that into a single page, for quick transitions.
User Persona
User Persona is a method / tool created in product design & development process to represent the characters of a group pf people. It answers the questions like “For whom we design the product?” and “What are the characters of this group of people?” which enable the product made to meet the real needs of its users. User personas also make the product design process easier by offering a vivid character of users.
Job Map
I did a Job Map as a way of empathizing, thinking of the person’s behaviors and needs. I started discovering, based on online research and my assumptions, the core functional job, which was:
A complete e-sports platform, with a variety of activities in it. So that users can be entertained.
After defining it, I deconstructed the steps of this job, almost like a journey map focused on what they are trying to get done (a needs view), instead of what they are doing (a solution view).
Due to time constraints and personal decision for this study, I assumed the desired outcomes in each step, that is how the person would measure the success of doing the job. In a real case, it would be required qualitative research.
Name and Logo
For name, I talked to one of my friends who came up with RevivalPortal.
Basically Revival + Portal (a doorway, gate, or other entrance, especially a large and imposing one.)
For Logo, I just have combined two typefaces “Poppins” For word Revival and “Playfair Display SC” for word Portal, I chose the serif typeface to give the logo a traditional look and feel.
Wireframes
Wireframing was a great tool for me in the early stage as I said earlier that iteration was my on to a way to reach my goals, wireframing made is easier to communicate with ideas and solve a problem.
The Wireframing process was consist of paper wireframing, lo-fi wireframes and lastly the hi-fi wireframes which was done on Figma.
Visual Designs
Here is the Figma file! Play Around!
Style Guide
Colours: —
Font-Family: —
Challenges
The biggest challenge while making this design was to simplify the information architecture and make easy flows for the concept. While making information architecture I understand the importance of visual hierarchy and white space in the design. Overall it was a great learning experience understanding researching an idea to an actual working concept.
Contact Me
💌Email: nao2ch@gmail.com For design Projects.
Follow Me Here
