voices.com responsive web design 2013

33
David Ciccarelli Founder & Chief Executive Ocer [email protected] www.voices.com Responsive Web Design

Upload: voicescom

Post on 13-Jun-2015

432 views

Category:

Design


1 download

DESCRIPTION

In Voices.com’s pursuit of innovation, we have embarked on a web redesign project that will allow our customers to have a consistent experience using Voices.com regardless of which device they are using. Voices.com has explored various approaches to presenting content in a consistent manner across these devices and ultimately settled on what is quickly becoming the new standard, responsive web design.

TRANSCRIPT

Page 1: Voices.com Responsive Web Design 2013

David CiccarelliFounder & Chief Executive Officer

[email protected]

ResponsiveWeb Design

Page 2: Voices.com Responsive Web Design 2013

IntroductionChallenges in Modern Web Design

One of the challenges of modern web development is designing a website that looks great on a myriad of Internet-enabled devices. Just think of all the ways you access the web today; your mobile phone, a tablet, e-reader, netbook, laptop, desktop and maybe even an HD-TV.

Innovative Design Solutions

In Voices.com’s pursuit of innovation, we have embarked on a web redesign project that will allow our customers to have a consistent experience using Voices.com regardless of which device they are using.

Instead of designing for a single screen size, we are now designing for multiple screen sizes, from smart phones to tablets to desktops.

Voices.com has explored various approaches to presenting content in a consistent manner across these devices and ultimately settled on what is quickly becoming the new standard, responsive web design.

Responsive Web Design Voices.com will be launching a re-imagined website using a modern development technique, known as “Responsive Web Design” or RWD for short. Responsive web design allows the content on a page to gracefully adapt to the dimensions of the browser.

Broadly speaking, these dimensions fall into three categories; mobile, tablet and desktop.

Mobile First

In addition to designing for three screen sizes simultaneously, a best practice is to design for the mobile device first. While not a hard and fast rule, the premise is to design thinking about mobile first. By doing so, designs will be constrained by the lack of screen real estate and only vital features will be included in a final design.

Our Design Mission Statement

The end result of the redesign will be the fulfillment of our design mission statement, giving Voices.com customers a consistent experience across the web, from mobile, to tablet and the desktop.

Page 3: Voices.com Responsive Web Design 2013

TemplatesPage Layouts

for the three screen sizes

Page 4: Voices.com Responsive Web Design 2013

Mobile Template

Page 5: Voices.com Responsive Web Design 2013

Mobile Navigation

Page 6: Voices.com Responsive Web Design 2013

Tablet Template

Page 7: Voices.com Responsive Web Design 2013

Desktop Template

Page 8: Voices.com Responsive Web Design 2013

My Account

Page 9: Voices.com Responsive Web Design 2013

My Account with Your Mobile

Page 10: Voices.com Responsive Web Design 2013

My Account with Your Tablet

Page 11: Voices.com Responsive Web Design 2013

My Account on Your Desktop

Page 12: Voices.com Responsive Web Design 2013

Log In

Page 13: Voices.com Responsive Web Design 2013

Log In with Your Mobile

Page 14: Voices.com Responsive Web Design 2013

Log In with Your Tablet

Page 15: Voices.com Responsive Web Design 2013

Log In on Your Desktop

Page 16: Voices.com Responsive Web Design 2013

Jobs

Page 17: Voices.com Responsive Web Design 2013

View Your Jobs on Your Mobile

Page 18: Voices.com Responsive Web Design 2013

View Your Jobs on Your Tablet

Page 19: Voices.com Responsive Web Design 2013

View Your Jobs on Your Desktop

Page 20: Voices.com Responsive Web Design 2013

Job Postings

Page 21: Voices.com Responsive Web Design 2013

Job Posting Details on Your Mobile

Page 22: Voices.com Responsive Web Design 2013

Job Posting Details on Your Tablet

Page 23: Voices.com Responsive Web Design 2013

Job Posting Details on Your Desktop

Page 24: Voices.com Responsive Web Design 2013

Responses

Page 25: Voices.com Responsive Web Design 2013

Listen to Auditions on Your Mobile

Page 26: Voices.com Responsive Web Design 2013

Listen to Auditions on Your Tablet

Page 27: Voices.com Responsive Web Design 2013

Listen to Auditions on Your Desktop

Page 28: Voices.com Responsive Web Design 2013

Messages

Page 29: Voices.com Responsive Web Design 2013

Receive Messageson Your Mobile

Page 30: Voices.com Responsive Web Design 2013

Sent Messageson Your Tablet

Page 31: Voices.com Responsive Web Design 2013

See All Messageson Your Desktop

Page 33: Voices.com Responsive Web Design 2013

About Voices.comVoices.com was established in 2004 and is now the technology and industry leading website that connects businesses with professional voice talents. Radio and television stations, advertising agencies and Fortune 500 companies rely upon the Voices.com marketplace to search for, audition and hire voice talents with the assistance of our innovative SurePay™ escrow service and our Web application.

The winner of several awards, including the 1to1 Impact Award, Customer Relationship Management Elite Award, and the DigiFest New Voices Award, Voices.com has raised its profile significantly this year ranking on the PROFIT Hot 50 recognizing 534% growth over the past two years. In 2012 Voices.com won “Business of the Year” from the Chamber of Commerce.

Clients include AT&T, Google, Microsoft, Cisco, Kaiser Permanente, ABC, ESPN, PBS, The History Channel, The Discovery Channel, Reader’s Digest, Comcast, Bell Canada, ING, Western Union, Ford, GM, Jaguar, US Army, the US Government and tens of thousands more.