Tangerine Responsive Redesign

IxDA Toronto UX Show and Tell - Responsive Design

Interaction Design, CXVadim Tslaf

Page 2

• Marketing decision on design “facelift”

• Converting the public site to RWD

How it all started

IxDA Toronto – Tangerine Responsive Redesign

Page 3

Initial challenges• Decision on channels for RWD conversion

• Assessing a feasibility of responsive redesign implementation with IT

• Choosing the right framework for RWD

• POCs (Proof of Concept) – lots of them

• Decisions on process – waterfall, agile, other.

IxDA Toronto – Tangerine Responsive Redesign

Page 4

Content analysis and IA• Hundreds of pages, dozens of different page structures

• No unified navigation

IxDA Toronto – Tangerine Responsive Redesign

Page 5

Universal design solutions• Developing universal solutions for RWD adaptation

• Creating a simplified navigation

IxDA Toronto – Tangerine Responsive Redesign

Page 6

Wireframing• Wireframing key pages for all responsive layouts

IxDA Toronto – Tangerine Responsive Redesign

Page 7

Visual design

IxDA Toronto – Tangerine Responsive Redesign

Page 8

Rebranding and front end development

IxDA Toronto – Tangerine Responsive Redesign

Page 9

Thank you