TotalMovie Responsive Site Design

2012
ROLE
Contract UXA + IxD
Contracted to fill in for a new contract while the agency hired a new designer. Architected experiences for new payment options, IxD Responsive experiences based on existing desktop experience.
THE CHALLENGE
Integrate two new payment options, design and integrate an EPG, and design mobile and tablet experiences. Translated the existing site to Tablet using heuristics to support the differences in tablet usage vs site, and designed the experience for Paypal and Cash Account.
I jumped right into reviewing screens that were in development to identify needed improvements, and to define new payment, a new EPG, and refine ordering/purchasing experiences to improve existing – and incorporate new, options.
The biggest challenge was that the schedule was based on technical implementation (technical partner) and the UX team was brought in as an after thought by the technical partner after recognizing their client needed Product Management and User Experience guidance.
App Map depicting new pages, existing pages that will have changes, and existing pages with no exchanges. The team is able to get a sense of the scope of the effort with simple color indication.
THE APPROACH + RESULT
After incorporating new payment methods, and refining the order and check out processes, I designed the Live TV and EPG for tablet ( and then mobile) site (both TotalMovie & IUsacell – sister company) using heuristics to support the differences in tablet usage vs. site and eCommerce. Conducted a quick competitive analysis to identify baseline features to ensure the product can support the same functions, and implemented heuristics to offer an improved experience compared to competitors.
After designing the EPG I examined how new functionality and the Live TV could impact the other sections. Most notably, a team member had worked with a similar service and noted that “My Queue” was of significant importance to users so I designed a My Queue/Favorites carousel for TV which was then designed for Movies and Music – This should enhance the usefulness and user satisfaction.
Wireframe depicting navigation interactions for episodic property content
The existing mobile and tablet closely experiences resembled the site which had too many levels – Particularly for mobile and tablet. So with this version I refined interactions to be more concise and optimize contemporary touch design patterns.

Wireframe of EPG for Mobile showing navigation to details of a show
Designed the addition of Live TV and EPG for tablet site using heuristics to support the differences in tablet usage vs site. Conducted a quick competitive analysis to identify baseline features to ensure the product can support the same functions, and implemented heuristics to offer an improved experience compared to competitors.
After designing the EPG, I examined how new design patterns and the Live TV would impact the other sections. Most notably, a team member had worked with a similar service and noted that “My Queue” was of significant importance to users so I designed a My Queue/Favorites carousel for TV which was then designed for Movies and Music – This should enhance the usefulness and user satisfaction.
The first translation of the site to mobile and tablet closely resembled the site which has too many levels – Particularly for mobile and tablet. So with this version I designed the interactions of accessing more details to be divs rather than pages (WF page 17-21).
We had interesting discussions about the navigation which is by media type – Movies, TV, and Music. With the addition of Live TV and a EPG which includes Movies, the sections need to be collapsed with content appearing in all sections or a redefining the navigation all together. This version begins the integration but the design is conceptual until the inventory of provided content is received.
CONSIDERATIONS
New Functionality Allowed!
Any new functionality can be applied to the other media – Movies and Music
Metadata and content is limited to what content providers provide BUT we don’t know what that is right now.

You may also like

TIBCO LiveView Web Dashboard Real-Time Dashboard
2015
Elavon - UX Strategy + Design for Responsive Site
2013
GW University's Design System for Enterprise CMS + Site
2011
CTIA Wireless Quick UX Strategy for Redesign
2013
Toyota Financial Services - Customer Portal Strategy
2014
Site Heuristic Evaluation + Recommendations coming soon
2016
Selecting a new CMS via UX: Design Thinking
2011
Back to Top