Youfone website redesign
Design for the website of Netherland based OTT — Youfone, Internet and Mobile network provider with hundreds of thousands customers.
Goals of redesign

1. Make it look modern
2. Apply new style guidelines
3. Make it responsive for any screen wide

So I've got a few designs from a former designer, some low fidelity prototypes from client's UX Designers and no specification :)

It was the tip of the iceberg.

Case studies based on a Value Proposition Canvas
After all negotiation we decided to focus on reusable elements. Like Atoms and Organisms in Atomic Design.
Job: adjust pictures, text blocks, urls, buttons and design it manually.
Pain: adding and adjusting different content manually takes lot of time.
Gain: content pages with different types, but with the same style (based on style guidelines) are on the website in time.

Products & services: ready to use template modules for blocks with text, with text and picture, text picture and button, 3 types of tables, text with icons e.t.c.
Pain reliever: ready to use well-designed blocks for every need makes it possible to decrease spending time on task.
Gain creators: lots of well-designed templates help to content-manager to keep the style, because everything is ready to use.


Let's talk about Channels overview page. People were struggling when were trying to choose the right channel package.

Glossary
Interactive services: functionality available on the channel list.
Pausing — you can pause the channel playing and play when you need.
Looking back — play TV show or News that passed.
Recording — record TV show to see it later.
Rewinding — to skip some moment.


Job: choose and compare channels with convenient interactive service and content.
Pain: It's not convenient to choose and compare channels and services from the pdf file, so a big chance to make mistake.
Gain: Right TV channels with convenient interactive services are chosen.

Products & services: filter with description for each service and checkboxes helps client do not scroll and compare; description for a channel is available.
Pain reliever: all of the channels are in one table, with filter which helps to choose channels by services.
Gain creators: filtration by interactive service (all or a few), description, filter by TV package help to make the right choice and order it.


What have I learned from this project?

If I had first started working with this project first, I would have talked with steak owners and a business analyst before developing layouts. But in the middle of the project it is also possible.