experience design + strategy
ICSC_iPad_Mockup.png

ICSC

the ask

the ask

Align 25+ client stakeholders behind a shared vision to launch an entirely reimagined digital experience for a 75,000-strong professional community.

Overview

Overview

The International Council of Shopping Centers (ICSC) is the global trade association of the shopping center industry. ICSC came to VSA in need of a redesign that would cement the organization as the voice of the retail real estate industry. The site was a sprawling, 10,000-page, 9-tab experience challenged by a complex information architecture and a confusing and dated digital experience. Check it out here.

Our discovery research consisted of 30 stakeholder interviews, a user survey, conversations with real estate professionals, and a competitive review of other member experiences and functional analogs.

I developed personas early in the process in order to help summarize and communicate our research insights. They were intended to generalize common behaviors, needs and pain points. Our Personas were a critical tool for helping both our internal and external teams build empathy for our end-users and remain focused on their needs. We used them as shorthand throughout our process.

Experience Principles

Experience Principles

In addition to our personas, I created an Experience Strategy Blueprint and a set of Experience Principles to provide us with an articulated vision and set of values to guide our approach. Framed in response to the core challenges we identified, we used these principles to clarify our focus areas, direct our work and align our objectives.

 Our Experience Principles and Experience Strategy Canvas, below.

Our Experience Principles and Experience Strategy Canvas, below.

Experience Strategy Canvas

Experience Strategy Canvas

Armed with a blueprint for change, our small and nimble team of content strategy, technology and UX was equipped with a vision for ICSC's new member experience – plus a roadmap for getting there.

As a first step to kick, I teamed up with content strategy to rework the site architecture and navigation flows. Our goal was to reduce the amount of choice and cognitive load, improve content hierarchy, and make it easy for visitors to scan, and understand, their options before diving deeper. We tested our IA models using a card sort. See the Before-and-After IA here.

IDEATION

IDEATION

From there, we began mapping out the information design of these key areas of the site through collaborative sketch sessions.

Design Approach

Design Approach

Creatively, my goal was to establish a clean, app-like look and feel through the use of generous white space, responsive content structures, and tap-friendly UI controls. Our small team (me, a visual designer, and a content strategist) was energized to bring the best of consumer grade event experiences to this professional community.

 View the animated  prototype here.

View the animated prototype here.

Register.gif
Component-Based Design

Component-Based Design

From the outset, our creative strategy centered on a mobile-friendly, component-based design approach. This would entail breaking up the UI into small, reusable chunks that would enable them to be assembled in a variety of ways to build anything from larger components to entire pages, and to flex across different areas of the site over time.

ICSC.png
ICSC_Phone_Mock_1.png
ICSC_Phone_Mock_2_sm.png
Development

Development

I teamed up with our tech team to define an approach for the build. We chose to leverage Pattern Lab to create a robust atomic design system to enable us to efficiently build, preview and troubleshoot components across different device sizes in browser, plus capture them in a single library. This would enable the web and application architecture to stay up to date over time, and would give ICSC greater flexibility. We were confident this would be a major efficiency boost. (Check out our my to-do's from that busy time here!)

 Our Pattern Lab sandbox enabled us to stress test our components in browser.

Our Pattern Lab sandbox enabled us to stress test our components in browser.

pattern_lab_02.gif
 Highlights from our final design toolkit.

Highlights from our final design toolkit.

Results

Results

• Radically simplified information architecture and paths to content

• Made the site more user-friendly, mobile accessible and easy to navigate

• Introduced capability to “cross-promote” relevant content to encourage circulation across site areas

• Created a UI toolkit that empowers ICSC to maintain greater brand consistency

So far site data has shown returning visitors increased by over 160% after the redesign of the site and mobile usage went up over 9x, eclipsing desktop usage, with its launch. In addition, the ICSC team has reported dramatic time savings in authoring content.