The New! Part 1: Responsive Design

September 12th, 2013 | Posted by Quixey in Quixey News

This post is part 1 of a Q&A with Jeff Fan, Quixey’s Principal Designer. Today he talks about responsive design on the new, as well as some personal design tendencies.

How important is it to have a unified interface and experience across all platforms? How did this factor into creating the new Quixey site?

Back in April of this year, our O&O/UX team found itself at a crossroad. We had recently launched the newest version of our desktop site and were eager to begin usability enhancements. At the same time, Quixey’s mobile site had gone untouched for months and was quite outdated in its design and features. This was especially problematic for our partners, who relied on us, as the mobile app search experts, to provide extremely forward-thinking products. To make things even more complicated, neither our desktop site nor our mobile site were optimized for tablet, and thus performed poorly with our users. The question stood: which do we redesign first – desktop, tablet or mobile? The answer we ultimately concluded was, “Yes.”

As a company that offers app discovery across all platforms and all devices, it was imperative that Quixey’s core product be accessible on all platforms and all devices. We wanted to introduce new features, maintain consistency across all products, and take full advantage of HTML5’s capacity. To achieve these goals, we turned to responsive design, a growing trend that uses a single HTML code accompanied by multiple CSS files. This allows the site to shift its layout and styling based on what device the user is using. Designing our web app to be responsive was a great challenge, but its success meant that we could reach our users in ways we never could before.

Responsive design comes with its own set of parameters. Solutions that work for one platform may not necessarily work on another. For example, hover states are a common tool used on desktop sites to hide away content/functionality but still allow for fast and easy accessibility. Unfortunately, hover states do not exist (for the most part) on mobile interfaces. (Samsung did manage to include hover states in their Galaxy S4). From a design perspective, all content/functionality you would have hid behind a hover state now must be exposed on the surface. More elements on a page imply higher information density, more complexity, and lower visibility on core features. This design process forces you to create a strict prioritization of your features, and the necessity of certain features should frequently be called into question.

How much does the work of other designers and companies affect the design decisions you make, both personally and professionally?

As a designer, it’s important for you to be constantly observant of design trends around you, as the work of other designers can act as a great source of inspiration for your own work. By constantly looking, you’re constantly learning. You’ll have exposure to a greater set of design possibilities. You should always be seeking ideas and fresh approaches to problems you had never considered. Another reason to stay aware of other designers’ work is that they can act as a testing stage for your own design theories. Observing both successful and failed designs provides an analogy for the potential success of your own design ideas. This is a quick shortcut to filter out ideas with low probabilities of success so that you can focus on the ideas that are more likely to survive.

If you could update any product’s design in the world, which would it be, what would you change, and why?

There are a lot of things I would want to redesign: the new Yahoo! logo, the food menus of 90% of restaurants I walk into, and anything operated by all levels of government (the BART subway map, road signs, IRS forms, etc.) But the one thing that desperately needs to be redesigned that affects my life every day is the license plate. I don’t drive a particularly fancy car — a grey Mazda 3 hatchback — but I really fell in love with its look and feel. It’s not showy, but there’s something about its proportions and its “sort-of-a-spoiler” that makes it like eye-candy to me. But the day came when I had to slap on my license plate, and something about it just didn’t look right. It’s like having a little coffee stain on the corner of your white oxford shirt — I kept staring at it thinking “WHY?! WHY ARE YOU THERE?!”

This is why people who buy fancy sports cars don’t like putting on the plates. You’re taking something beautiful, something a team of people labored for years perfecting, and slapping something horrifically ugly on it. It’s like when the Apple team spent a year making the new iPhone 5 18% thinner just to have people slap on cases, immediately undoing all their hard work $5.99 plastic cases. License plates could definitely look better. The government really should skim a bit off our defense budget and start an internal design branch.

Stay tuned for next week’s post, where Jeff will take a deep dive into all the new features!

You can follow any responses to this entry through the RSS 2.0 You can leave a response, or trackback.

One Response

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>