Redesign
enikos.gr : UI Designer - Product Manager
This project started as an idea and became a need
It was a complete redesign both on the front end and the back end of the news website.
Base responsibilities were the UI Designs along with the coordination of the dev teams
Basic sketches started with Figma and finished in Photoshop for the final iterations
One of the main challenges was to find the way to keep the site a blog and not follow the norm of News Portal.
My role started as a UI Designer and evolved into a Product Manager after the final designs where communicated and approved.
The whole project was a success and most of the milestones were met and most of the deadlines kept
Sketches
I usually start the design process with low fidelity wireframes. This is the way I iterate through many design options quickly.
One of the main reason of my sketches was to get the approval of the main design.
After studying the behaviour of our users using Analytics and hot spots on our site, I've started making decisions on elements and the main flow of the website.
There have been 6 different rough sketches of the main page with several alignments on the main news feed and customised widgets.
Having the main focus to keep the blog style website and avoid looking as a classic News Portal website, the choice of design was not that easy to begin with.
Most elements were placed according to the previous website design to keep the changes aesthetically pleasing to the user and keep the main focus on the news feed.
Wireframes
At the beginning of my design process I created wireframes for testing purposes.
Having a more realistic view on the previously made sketches made it easier for everyone on the team to make decisions and changes throughout the designs.
Most of the wireframes were created with Figma alongside with Illustrator when high fidelity designs were needed.
Having three to four iterations per page, was a great way to present different optics and perspectives to every team meeting.
UI Design
Once I tested out all usability mistakes, I started designing the final screens in Illustrator and XD.
The visual style I've used, kept the main brand colours and kept a clean and easy to follow look.
The main inspiration for this style was to make the most efficient and minimal way to keep the focus on the main news feed.
The website was created for web mainly and made responsive for mobile devices, with a main difference on removing the widgets from the sidebar and placing them throughout the main news feed.
Lots of lessons learnt in the time I was part of this project.
Mainly I practiced my communication skills between several teams of devs and management to keep a clear view of the scope we've all accomplished.
My biggest fear was the workload and the deadlines that we've been given to start with.
With an efficient channel of communication and a pretty clear work schedule of responsibilities and tasks it all worked fine at the end.