revamp-header

Content revamp

Description.

The content creation section is one of the most important in the user journey.
Every user needs to upload, edit and track the content.

The previous sulotion had many defacts;
* Users had to scroll up and down between the sections while working
* Users made manual labor while the automatic version wasn’t enough prominent
* Lack of a proper preview (which is very important)
* Current design couldn’t scale for new features and product vision (Carousel and video support).

I took this project as my baby, and with the support of my product and the front-dev as a partner, we made a big change.

  1. We set KPIs how to measure success in the process and post-release.
  2. I’ve collected data from the BI team, Google analytics,  Fullstory (that I’ve implemented) and our customers, internal and ecternal.
    I wanted to better understand the numbers, problems, usage and wishes.
  3. After mapping the new insights, I’ve started with couple of new concepts to address the new needs.
  4. I went to an early user testing with actionable prototypes to get feedbacks and understand what works better.
  5. When the new concept was selected, The dev and I designed the new layout to have as lowest pushbacks as possible.
  6. All relevant stakeholders were involved in the proccess and the big feature was divided into chunks to get early big data and usage insights.
  7. We exact our solution with every release untill all the features were out, with really great feedbacks 🎉

Eraly-stage axure prototype (test it)

Advanced concept axure prototype (test it)

In the old solution, the user entered a URL and the platform auto-crawled an image and a title. From the data that I’ve pulled I’ve noticed that only 28% keep the crawled data, so I removed this feature to see how it affects the users. Users didn’t understand who moved their cheese, and although they didn’t intend to keep the crawled data, they asked to have this feature back. I’ve added a checkbox to bring control back, but kept it unchecked (the system crawls in the background so the user can turn it on and see results immediately.

content-checkbox

Every website that present the content pieces has a different CSS, causing the headlines getting cut and affect preformance.  The preview pane on the right panel shows how the headline will look at the 4 most common dimentions Outbrain works with, so the user could adjust the text. There’s also a warning next to the headline field so the user gets immediate feedback.

content-headline

One of the key flows is creating variations of the content pieces in order to test which headline and image works best. In the old design this feature was under a modal and the CTA was undifferentiated for some of the users.
In the new design the variation is embedded in the flow, and the user doesn’t need to make an extra effort in order to create it.

An immidiate feedback is being shown so the impact is very clear.

Another feature was the carousel that was embedded while keeping the same layout for a continuously experience.

content-carousel

Related Projects