PLAYNET: The Gaming Platform
Visual Design
Role: UI/UX Designer
Duration: 1 month
Softwares: Sketch, Photoshop, Illustrator
Platform: iOS
Background
Nowadays, aside from digital games, there are various games, which require people play in person physically, such as board games, card games, dice game, and even battling tops. Many people want to play these games, but not all of them have enough game buddies to play with them at that moment. In order to solve this problem, Playnet is here for them! Playnet is an online platform for users to connect each other and play games together in person! Let's connect and make more gaming buddies!
Logo
Improvement
Cleaner Filter and “Ready Button
Filters are changed from a few simple tags of distance to the filters with more details. A new function called “Ready Button” is also added next to the filters. This button can show only the party can be joined immediately in order to save users’ time of searching manually.
Originally, the search page has various photos to represent specific type of games; However, I change the way of the presentation from photos to icons. Honestly, icons make the representation much cleaner.
Change of Theme Colors
Since Tiffany Blue and White don’t have enough contrast, I decided to change the colors combination.
Color
Blue #00509D
Playnet is a open space for users to connect each other with freedom to expand their network. Blue is a color represents open space, freedom, expansiveness, and inspiration. These key factors makes blue meaningful and suitable for Playnet.
Orange is a luminous color of the spectrum. It’s the color that captures our attention more than any other color.
Grey #4A4A4A
Neutral color that applies most of the text over the app.
Grey #9B9B9B
A second neutral color that applies to the visual elements such as dividers and strokes of containers.
Typography
Typeface and Font
The typeface of this app is SF Pro, SF Pro features nine weights, variable optical sizes for optimal legibility, and includes a rounded variant; moreover, this SF pro provides more fonts which represents different hierarchy.
Icons
Design Kit
