UX Design
The most popular opinion-forming portal in Poland in the category of information and journalism.
Role
UX/UI Designer
Goal
Redesign Onet.pl platform by applying UI and UX best practises.
Approach
In order to start re-designing the website I needed to understand current its issues: what people are complaining about, what they are mad about or what they wish had been changed. To obtain required information I interviewed 8 people and asked them questions about the current design.
Research group
- 8 people
- Age 18-55
- 3 Males, 5 Females
What do users think?
“The site seems a bit chaotic”
“I feel like 3 menu bars is too much”
“Some labels are misleading or sometimes even missing”
“The content is too packed. I feel like there’s information overload”
Conclusions about the current website
- 5 people thought the website was easy to use
- 4 people thought the website was easy to read
- 3 people had difficulties to find information
- 3 people could NOT find desirable functionalities
GUS (Central Statistical Office) Data
In 2021, 83.6% of people in Poland aged 16–74 used the Internet regularly (at least once a week). Of the Internet users, 81.3% read the news or online newspapers and magazines. Most of them are people aged 35-44. The majority of younger people were women in the older groups, men.
Current design
In this section I present an overview of the current design.
First a few good points:
- Designers used a color scheme that reinforces brand identity and a font that compliments brand values.
- There is a good use of contrast and hierarchy
- Bottomless page encourages users to stay longer on the website – which correspondences with a goal of increasing the average time on the website.
Below I present some weaknesses:
- Current design seems cluttered and overwhelming, which makes the page less readable.
- There are three menu bars, which might be confusing for users.
- Another issue is that the second bar doesn’t show all the options – you can see all of them only after clicking the three-dots icon. After clicking it you can see other categories but it also turns out that the TV program button is displayed again, which is not necessary.
- The label for Offers (“Oferty”) seems inadequate – after clicking it, the user is redirected to a fashion-related partner website.
- The top menu stays in place – however, the labels for the icons disappear and the icons on their own might not be clear enough.
Current Issues
Readibility
Recurring content
Chaotic grouping
New design
Problem
Creation of a website for Internet users to easily access the latest information.
Tools
Balsamiq
Figma
Strategy
Users need to...
- Be able to find the newest information easily
- Be able to find articles by categories (from politics to cooking)
- Be able to Filter articles
- Be able to scan content in order to find interesting articles
- Be able to search for specific content
- Access sub-platforms like e-mail, VOD, dating platform
- Check weather forecast
Business Objectives
- Ad space optimization
- Extend your stay on the site
- Increase user engagement
- Increasing interest in partner services
- Increasing interest in sub-platforms
Experience Pillars
Intuitiveness
Readability
Convenience
Result
- All interviewed users liked the idea of filtering articles by categories and admitted that it accelerates the time needed to find necessary information.
- 7 out of 8 interviewed users recognized the redesigned website as more clean and readable than the original one.
- 6 out of 8 users find the column with the newest articles useful.
Wireframe
In this section I explain the decisions I made during the designing process:
- The top menu includes company’s logo, sub-platforms’ icons and search widget. These components should be easily accessible at any time that’s why the top menu should be sticky.
- Weather forecast only shows basic information so the design is not so cluttered. After clicking you can read more.
- On the right there is a column with the newest articles. All freshly posted articles will show in the column with the exact time of publication to give users sens of being 100% up-to-date.
- I used a grid-based design to will make the website easy to scan and to navigate.
- I aimed to maximize the white space on the website to make it look clean and professional.
- The original structure was a bit chaotic. In the redesigned version I wanted to make sure that the articles are properly grouped and that they are easy to filter.
- I made sure that there are ads included in the design as it is important from the business point of view.
User Testing
For the user testing stage I interviewed 4 people – they were asked to imagine performing actions on the low and then high fidelity design of the website. I asked them to evaluate each task and overall experience of using the website.
- At first I wanted to include the weather forecast at the top, sticky menu. Users drew my attention to the fact, that you don’t need weather forecast when you scroll this type of websites.
- Again, for the weather forecast – users didn’t know they can click on it to see more details. I added a visible information thanks to this.
- Users liked the idea of using labels with categories. They suggested using colors in order to easily distinguish one from another.
There is no need for the weather forecast to be on the sticky menu. “See more” button needs to be added.
Final Deliverables
I didn’t change much about the color scheme and I decided to choose the same font family as the original design. Consistent color scheme and typography will ensure the recognition of the brand and key components on the website.
Colors
Typography
Fira Sans
