Meet the UX/UI Designer Behind PolicyMic 2.0

Editor's Note: This post is part of a technology education series sponsored by Treehouse. In this Q&A series we turn to our very own product team to discuss PolicyMic’s web development and design.

Name: Liran Okanon

Age: 25

Title: Lead Designer – Responsible for all UX / UI for the consumer facing site as well as visual identity for the brand.

College: Parsons – The New School for Design / Communication Design

Twitter: @leelee061

PolicyMic (PM): You’ve designed for a diverse group of companies, ranging from West Elm, a large furniture company, to VFILES, a boutique fashion site. How did you end up becoming the lead designer at PolicyMic?

Liran Okanon (LO): As a designer, I think it’s important to recognize that there are a set of core principles that provide continuity in all the work I’ve done. At West Elm, simplicity was a key component to developing the layout and user experience (UX). With millions of users visiting the site every day, the UX team had to make sure the site was easy to navigate for users of all ages and digital competencies. On the other hand, at VFILES, we were building a web product for a young and tech-savvy demographic to share different types of media. That said, we still had to craft a way for all of this content to be both easily accessible and well-presented.

Transitioning from a primarily e-commerce background to a new media site like PolicyMic was a challenge I was looking forward to. The primary goal was to make the content as engaging as possible. Here at PolicyMic, we have the opportunity to reinvent what reading the news means, and our mission is to build the defining news experience for young people in the digital age.

At its core, web design requires a deep understanding of the principles of design, which I learned in school but others are learning on interactive platforms like Treehouse's Design Foundations.

PM: There has been a lot of positive feedback since relaunching PolicyMic. What inspired the redesign?

LO: A big part of the redesign was simply the rebrand. We knew we had to continue to establish PolicyMic’s brand as the go-to place for high-quality news, and that needed to be visually represented. The first thing we did was give our logo an uplift, which was no easy task. The logo is supposed to convey authority but also have a contemporary elegance to it. There’s also a sense of timelessness, because we intend for PolicyMic to be relevant not just for the next five years, but for the next 75 years. Many members on the team came into the process with their own pre-notions and ideas of what that meant for the logo. It would have been helpful if everyone understood some key fundamentals to designing a good logo.

In regards to choosing the color scheme, it’s actually quite interesting how we came to a decision. Color sets the tone on the site. It’s an important signal to people on how they should feel about your brand and content. We settled on a light blue because it maintained that sense of authority and quality, but also makes the site feel friendly and relatable.

PM: How did you approach building consensus around your vision for the design?

LO: The product team at PolicyMic is very collaborative. Going into it, there was no personal agenda with the redesign besides making a better site for our users. The only thing I fought for was making sure that the site felt fresh and new in its design, opting for a flatter, cleaner design rather than the effect-filled site we had before. The goals were to ease the reading experience, increase user retention, and appeal to a broader range of users.

PM: Web design today requires a balance between aesthetics and functionality. How do you go about maintaining that balance in your designs?

LO: When redesigning a site, it is actually hard to balance both form and function. On one hand, your creative side wants to do so many things and explore a ton of ideas. On the other, you need to balance the user requirements. The process we took in redesigning PolicyMic was a traditional waterfall model, where we break up the process into specific steps in order to achieve a set of goals.

1. We started each new design with a very clear understanding of the features we wanted. Each feature was based on core product needs, or analytics and A/B testing results.

2. We then researched the designs and implementation of other sites with similar features. This research phase allowed us to conceptualize old and new ideas.

3. From there, we created digital wireframes with Adobe Photoshop to better understand the basic layout of our new pages. Photoshop has been an incredibly powerful tool in helping us visually articulate new ideas.   

4. After getting feedback and iterating through the wireframe, we started designs, either in photoshop or through rapid prototyping with our front-end team. Whenever we reached a critical impasse on an important piece of functionality, we always prototyped the design so we could see it in real life.

As a designer, what I see is completely different from what others see as first-time users. I have to remind myself to take a big step back and see the site from various points of view. 

Designing a new product from scratch is incredibly fun and rewarding. 

Sponsor: Learn more about Web design with Treehouse.

PM: For those interested in designing their own sites, what new developments in web design should they be looking out for?

LO: 2012 was all about highlighting images on the web; with Pinterest blowing up and Beyonce launching a completely media-based site. Internet users adopted webkit browsers, and developers were able to utilize HTML5 and CSS3 concepts which had been set forth several years prior.

Then in 2013, we saw the rise of the parallax which was used for everything from editorials to new product launches. This format allowed designers to tell a story on a single page rather than break a site up into multiple sections. It was a real step forward in web design and will not likely disappear anytime soon.

Now, there is a lot of attention being directed towards interactives and sites that allow users to play with data and media. There are a lot of one-off examples that have already been put into place, but I think we can expect interactive elements to become more mainstream this year. Furthermore, now that Apple has finally dropped skeuomorphism for a flat UI in iOS, expect 2014 to be devoid of any shadows, textures, or 3D effects.

Sponsor: Want to learn how to be the next great designer? Treehouse will help you get there.