The Problem

Exclusive agents were required to contact a number of sources by phone, email and the web to order office furniture, graphics and merchandise that fit the corporate brand. They were challenged with and frustrated by the complexity of this ordering process of office materials and fixtures, which diverted time and attention away from their customers and growing business.

The Solution

While learning about the exclusive agents and their difficulties staying “brand-right,” we discovered two paths, education and action, best defined the request website.

Education focused on the positive impact a “brand-right” office would have on their business. It recommended where agents should invest their money and outlined the customer experience per office “zone.” The education path also marked the distinction between the types of interior and exterior signage/graphics.

Action guided the agents through pre-selected style palettes consisting of paint and carpet recommendations. With a style palette chosen, agents select exterior signage, interior wall graphics, and furniture per office zone. Selections were emailed to the corporate office, where the corporate team processed the request and coordinated the ordering process with vendors. The website was not eCommerce, it merely facilitated the start of the conversation, moving the purchase process further down the pipeline quickly and with less frustration.

The Process

We began by drafting a potential user flow of how an agent would visit the website. How would it address their question? We walked through scenarios which eventually led us to a hybrid user flow and information architecture. We ran this user flow with the corporate team who most often hears the frustrations of the agents, since we were not allowed access to the agents themselves, for validation.

• 

• 

• 

• 

• 

With the user flow approved, we moved into creating wireframes in Illustrator for easy replication across the website. This wireframe became more of a wiremap, that being a sitemap of the wireframes, to help the client understand the structure of the website and the primary relationship between the pages.

We coded this website in-house with myself as the lead developer. Our annotations, therefore, were informal; handwritten notes on visual design prints that we scanned so everyone had a copy.

Initially, I was supposed to be a consult during the development process because I had never coded in C# or .NET, utilized MVC4, or used the .NET environment. However due to resource allocation, I swapped roles, teaching myself the aforementioned technologies to carry the project. I’m not going to lie, I was slightly panicked at first.

However, I was familiar with Java and C++ from undergrad, so learning the C# syntax was challenging, but not impossible. With Shawn’s help in converting the Photoshop files into HTML code and providing the initial jQuery, I tweaked the CSS and jQuery to play nice with C# and the IIS7 constraints. We coded using these constraints because we were told the client’s servers were Microsoft-based.

What We Learned

My team and I completed this website and delivered it to the client, packaged and ready to launch, but it never did. Once we got to the development stage, the timeline dragged because the client contact was unable to confirm which catalog items had been approved by internal teams, and their pricing. I think we went through 30 rounds of data correction, spreadsheets flying via email.

When the content was approved and all duplicates removed from the database, we discovered that the client’s tech lead was not, in fact, a developer, but a content manager, due to an internal client miscommunication at the beginning of the project. Then we learned that the client’s development uses Microsoft servers, but not Microsoft products for their web launches.

This was a fantastic learning experience about not assuming the client knows all the necessary details despite having their own internal expert, and despite our team sending over questions and asking for confirmation. We did manage to help the client identify who was necessary on their end to get the launch environment set up and into their requisition systems. I hope to hear the website was launched and is helping facilitate conversations between corporate and agents.

Responsibilities

Client communication, information architecture, user flows, wireframes, front-end development, backend database manipulation.

Team (December 2011 – August 2012)

Binaebi Akah (ux and lead dev), Shawn Limes (lead web designer and front-end dev), Jason Wood (dev consultant), Jonathan Broadfoot (account services).

Technologies

C#, MVC 4 framework, .NET developer environment, IIS7, SQL databases, CS4 Illustrator, CS4 Photoshop.