UNNOK
KPOP merchandise exchange app.
Overview
UNNOK is an application which use to help the KPOP fan community have the confidence to exchange KPOP merchandise with each other in this app.
My Role
Task
Duration
Tools
UX/UI design/
research/ Interview
Figma, Adobe Illustrator,
Adobe Photoshop,
Feb - April 2022
(3 months)
UX/UI Designer ,
Graphic Designer
Objective
-
This app provides KPOP merchandise exchanging, giving and flaunting to KPOP gan community
-
This app has to be a reliable app for doing an exchange and being a social media platform for the KPOP community in Thailand.
Solution
-
Every account has to register their Photo with an ID card and when they want to do an exchange or post to exchange, they can only take a picture at that time to prove that they have the product.
Research
Competitive analysis
-
Starting from finding what platform KPOP fans use and find what their problem with that platform or problem in that community.
-
What are the strength of that app and social media platform they like to show their KPOP products to their friends using to make new exchanges and social media in one application?
-
Twitter is the most popular platform for KPOP fans community has a main gimmick searching options like hashtag and their blog in the app
-
Shopee is a secondary application they frequently use to buy KPOP merchandise. So I want to intimate them by using some element from shopee.
-
Ig is a platform social media they use frequently to show off what KPOP product they get and how rare is it with their friends.
Define
Interview
Persona
User Journey
Ideate
Prototype
After group discussion, we then list what we need to have in the application and then jump into a prototype for user testing. In the prototype which separates from my group, I have 2 Interview prototype testing to find the problem for developing a final prototype.
Mid fidelity prototype
Login
Home
Create post
Post inside
Sitemap
Task flow
Style guideline
High fidelity prototype
I have developed prototype to my style and set the mood with style component. I created high fidenlity wireframe to have a usability test with KPOP fans for developing my prototype
Developing prototype
Positive
-
Use a lot of time in the Login stage but This makes them feel more reliable to do an exchange with another account.
-
Don't feel strange because of the familiar element from the regular app.
Negative
-
Too small buttons and Texts
-
Some task is not necessary to use and it makes them more confused like comments or review and owner card or the card they want to change.
Homepage
First draft I use too small fonts sizes so I change all font size to be bigger
Before
After
Before
After
Post detail
- Increase font sizes
- change status that shows what product he has and wants to change to just what product he wants.
Profile page
- Increase font sizes
- Change the Profile edit button to the Post making button to arrange the importance of tasks make.
Before
After
Chat to exchange
- Increase font sizes , profile account and exchange box
Before
After
Final Prototype
This is my final prototype in this UX/UI class to make a KPOP fan community and merchandise exchange app
with my style and develop from feedback in the usability test.
Flow 1 : Log In
Flow 2 : Change card with Nitchy L.
Flow 3 : Create a exchange post.
Flow 4 : Accept your exchange post.
Flow 5 : Accept card giving from ดอนนี่ ดอนหนี
Text style
Color style
Profile page box
Home page box
Icons
Navigation Bar
Profile Bar
Reveiw Box
Ui Elements
Offer box
Final Showcase
