Practise
Role
Role
Role
User Researcher
UI Designer
User Researcher
UI Designer
User Researcher
UI Designer
Time Frame
Time Frame
Time Frame
1 week
1 week
1 week
Client
Client
Client
Self Exploration
Self Exploration
Self Exploration
Project Summary
Project Summary
Project Summary
This project is an exploration to improve my UI skills. Through practical experience with modern design principles and efficient UI techniques, such as wireframing and the use of components, variants, and auto layout, I've deepened my understanding of user-centric design and honed my skills in creating visually appealing and seamless interfaces.
This project is an exploration to improve my UI skills. Through practical experience with modern design principles and efficient UI techniques, such as wireframing and the use of components, variants, and auto layout, I've deepened my understanding of user-centric design and honed my skills in creating visually appealing and seamless interfaces.
This project is an exploration to improve my UI skills. Through practical experience with modern design principles and efficient UI techniques, such as wireframing and the use of components, variants, and auto layout, I've deepened my understanding of user-centric design and honed my skills in creating visually appealing and seamless interfaces.
Problem
Problem
Problem
This design project focuses on developing a modern and user-friendly Livescore Football Score mobile app with three main screens: Homepage, Search, and Detail. Utilizing efficient wireframing and UI techniques, the app employs components, variants, and auto layout principles.
This design project focuses on developing a modern and user-friendly Livescore Football Score mobile app with three main screens: Homepage, Search, and Detail. Utilizing efficient wireframing and UI techniques, the app employs components, variants, and auto layout principles.
This design project focuses on developing a modern and user-friendly Livescore Football Score mobile app with three main screens: Homepage, Search, and Detail. Utilizing efficient wireframing and UI techniques, the app employs components, variants, and auto layout principles.
User research
User research
User research
I started of my design process by conducting user interviews with football fans, our target audience. This allowed me to gain a deeper understanding of their habits and the obstacles they encountered.
After that I jotted down the main insights from the interviews and primary research.
I started of my design process by conducting user interviews with football fans, our target audience. This allowed me to gain a deeper understanding of their habits and the obstacles they encountered.
After that I jotted down the main insights from the interviews and primary research.
I started of my design process by conducting user interviews with football fans, our target audience. This allowed me to gain a deeper understanding of their habits and the obstacles they encountered.
After that I jotted down the main insights from the interviews and primary research.
Dice Skins
Coins
Gems
Token Skins
Undo/Rerolls
Things to be noted
Things to be noted
Things to be noted
Behaviour :
Eager to keep themselves updated about the scores even in between busy schedules. Wants to quicky see the details without having to click many times
Behaviour :
Eager to keep themselves updated about the scores even in between busy schedules. Wants to quicky see the details without having to click many times
Behaviour :
Eager to keep themselves updated about the scores even in between busy schedules. Wants to quicky see the details without having to click many times
Habbit :
Often tend to peep into the phone while driving, in meetings and other environments to check the scores
Habbit :
Often tend to peep into the phone while driving, in meetings and other environments to check the scores
Habbit :
Often tend to peep into the phone while driving, in meetings and other environments to check the scores
Barriers :
According to the user research, the target users find it annoying to constantly switch between live-score apps, as not all information is present in a single application.
Barriers :
According to the user research, the target users find it annoying to constantly switch between live-score apps, as not all information is present in a single application.
Barriers :
According to the user research, the target users find it annoying to constantly switch between live-score apps, as not all information is present in a single application.
Low Fidelity wireframes
Low Fidelity wireframes
Low Fidelity wireframes
Homepage
Search Screen
Details
Homepage
Search Screen
Details
Homepage
Search Screen
Details
Homepage
Search Screen
Details
Moodboard
Moodboard
Moodboard
It was time to create the mood boards and decide the UI guide lines. This, is my favourite part!
It was time to create the mood boards and decide the UI guide lines. This, is my favourite part!
It was time to create the mood boards and decide the UI guide lines. This, is my favourite part!
Main points
Main points
Main points
I made key decisions like placing the menu in the bottom right corner, highlighting top searches, and adding features for a faster, intuitive user journey.
I made key decisions like placing the menu in the bottom right corner, highlighting top searches, and adding features for a faster, intuitive user journey.
I made key decisions like placing the menu in the bottom right corner, highlighting top searches, and adding features for a faster, intuitive user journey.
...Soo I added a bit of my touch addressing the needs of the users I interviewed, this I believe enhances the usability of the product. I hope you like it!
...Soo I added a bit of my touch addressing the needs of the users I interviewed, this I believe enhances the usability of the product. I hope you like it!
...Soo I added a bit of my touch addressing the needs of the users I interviewed, this I believe enhances the usability of the product. I hope you like it!
Users frequently express frustration due to the lack of game details in the app's notifications Hence, my flow starts with the push notifications.
Users frequently express frustration due to the lack of game details in the app's notifications Hence, my flow starts with the push notifications.
Users frequently express frustration due to the lack of game details in the app's notifications Hence, my flow starts with the push notifications.
High Fidelity Wireframes
High Fidelity Wireframes
High Fidelity Wireframes
9:41
CHELSEA
Live Score :
Chelsea
1 - 0
Arsenal
Overview
Matches
group
Squad
stats
Wed 25 Oct
| Group stage
| Matchday 3
Chelsea
1 - 0
Arsenal
View Details
Squad
d
w
w
w
w
form guide
key stats
2
matches Played
Won
1
Drawn
1
Lost
0
Home
Favs
Live
More
Chelsea
9:41
See More
See More
Overview
Matches
group
Squad
stats
Highlights
Goal
Goal Attempt
form guide
Chelsea
d
w
w
w
w
Arsenal
d
w
w
d
w
other matches
Manchester
VS
Liverpool
Chelsea
VS
Liverpool
new castle
VS
Liverpool
Home
Favs
Live
More
Chelsea
Arsenal
1 - 0
Group E
full time
Watch Now
9:41
CHELSEA
Live Score :
Chelsea
1 - 0
Arsenal
Overview
Matches
group
Squad
stats
Wed 25 Oct
| Group stage
| Matchday 3
Chelsea
1 - 0
Arsenal
View Details
Squad
d
w
w
w
w
form guide
key stats
2
matches Played
Won
1
Drawn
1
Lost
0
Home
Favs
Live
More
Chelsea
9:41
See More
See More
Overview
Matches
group
Squad
stats
Highlights
Goal
Goal Attempt
form guide
Chelsea
d
w
w
w
w
Arsenal
d
w
w
d
w
other matches
Manchester
VS
Liverpool
Chelsea
VS
Liverpool
new castle
VS
Liverpool
Home
Favs
Live
More
Chelsea
Arsenal
1 - 0
Group E
full time
Watch Now
9:41
CHELSEA
Live Score :
Chelsea
1 - 0
Arsenal
Overview
Matches
group
Squad
stats
Wed 25 Oct
| Group stage
| Matchday 3
Chelsea
1 - 0
Arsenal
View Details
Squad
d
w
w
w
w
form guide
key stats
2
matches Played
Won
1
Drawn
1
Lost
0
Home
Favs
Live
More
Chelsea
9:41
See More
See More
Overview
Matches
group
Squad
stats
Highlights
Goal
Goal Attempt
form guide
Chelsea
d
w
w
w
w
Arsenal
d
w
w
d
w
other matches
Manchester
VS
Liverpool
Chelsea
VS
Liverpool
new castle
VS
Liverpool
Home
Favs
Live
More
Chelsea
Arsenal
1 - 0
Group E
full time
Watch Now
9:41
CHELSEA
Live Score :
Chelsea
1 - 0
Arsenal
Overview
Matches
group
Squad
stats
Wed 25 Oct
| Group stage
| Matchday 3
Chelsea
1 - 0
Arsenal
View Details
Squad
d
w
w
w
w
form guide
key stats
2
matches Played
Won
1
Drawn
1
Lost
0
Home
Favs
Live
More
Chelsea
9:41
See More
See More
Overview
Matches
group
Squad
stats
Highlights
Goal
Goal Attempt
form guide
Chelsea
d
w
w
w
w
Arsenal
d
w
w
d
w
other matches
Manchester
VS
Liverpool
Chelsea
VS
Liverpool
new castle
VS
Liverpool
Home
Favs
Live
More
Chelsea
Arsenal
1 - 0
Group E
full time
Watch Now
Prototype
Prototype
Prototype
sreelakshmi raghunath
sreelakshmi raghunath
Don’t let the time fly.
let’s go further, together!
Drop me a line at
Find my history here
Don’t let the time fly.
let’s go further, together!
Drop me a line at
Find my history here
sreelakshmi raghunath
sreelakshmi raghunath
sreelakshmi raghunath