ALL STAR CHALLENGE
Role: UI/UX – Year: 2015/2016 – Agency: Huemor
Each year, American Crew, a division of Revlon, hosts a global competition to find the best stylist in the world. A complete redesign was undergone to create a clean, sophisticated entry experience that aligned with the American Crew brand and increased the amount of contestants.
I lead the design and strategy implementation throughout the project. From initial wireframing and sitemapping, to visual design, developer hand-off and final QA.
I looked through the existing site to get an understanding of what was and wasn't working. Navigation wasn't obvious and was included in a slider. Each page had little content on it and there was a lack of clear calls to action.
Another issue was how text was being handled. In multiple places the type was saved into the image. That is not optimal for a site that needed to be multi-lingual and responsive.
Keeping the project goals in mind, I started to sketch out wireframes. The main goal was to Increase the amount of contest entires, goals two and three naturally lended themselves to accomplishing that. The American Crew brand allowed for a clean and open aesthetic.
I initially started with mapping out multiple pages, but soon abandonded that to side step the problem with the current site. After a few iterations I ended up with a single page experience, utilizing straight forward messaging and high quality images from previous contests and a multi-step sign-up prorocess.
Entering should be obvious and simple. A persistent navigation with a Signup button allows the user to sign up any point, regardless of their position on the page. Additionally, button copy that relates to what a user might be thinking; such as “How To Enter” and “Global Champion Prizes” was used to make actions easy.
Hair styles from previous years were utilized in multiple ways. They acted as inspiration for future contestants, bios for former contestants and a way for people to find a retailer for product. This content was placed inside a modal slider that is activated by click on a model in the gallery.