JULIA DEBARI
Designer Doer
Brand refresh and responsive web redesign
Project Length: 11 months
Tools: Figma, Zoom, Webflow
Team: 1 Visual Designer, 1 Developer, 2 Junior UX Designers
My Role: Lead CX Designer
Goals: Brand refresh after ten years. Simplify the ecosystem from five to one platforms.
Before
After
Project Background
The Copenhagen Institute of Interaction Design's (CIID) website had not been updated since 2014. It was on an old version of WordPress with custom code. No one at the company knew how to manage it, so they made microsites to update information and allow for online bookings of programs.
Project Challenge
The stakeholders were very nervous about making any changes as the website had pages of content built over 14 years. It was a spidery mess with organisms floating outside of WordPress as hacks.
In the Beginning
I started out as a team of one. I thought I could work fast and get the project done in six months. Just me and the stakeholders.
After creating a project proposal, timeline, and plan, I realized I needed some help. I brought on two junior UX Designers to help them build their skills as this project started the entire website process from scratch.
As far as a new web platform, after researching, such as interviewing the stakeholders and doing a competitive analysis of web platforms, I decided to go with Webflow.
Challenge Two
What content needed to be kept? How had the business changed in ten years? What was the Content Strategy moving forward?
Time for a site audit. The site audit took two months, with three UX people working on it (including myself).
So Many Pages...
7,119 Pages
The current website was:
• not mobile responsive,
• could not do registrations,
• did not offer checkout capabilities,
• could do text updates only,
• only allowed for static pages.
Final Page Count: 12
Webflow is a platform that allows for dynamic pages. Over 2000 of the pages were community members (alums and faculty). With dynamic pages, there was no need for static pages for each person. Everything is kept in a Webflow CMS using a page template to render a page as needed when a user visits.
How do we define our customers?
While the navigation seems simple, there was a big discussion about using the term Business. We did a brainstorm meeting with the stakeholders and came up with a few terms.
Students
Our primary audience are students. People who sign up for either the year-long program or week-long workshops.
Faculty
Our secondary audience are the instructors who teach the courses.
Businesses
Finally, our tierary audince are partners who offer project work to students or companies that we partner with for training or companies that we do consulting with.
Is Business the right term? Do we split it out into multiple options such as training and partners?
I decided to do a card sort to see what the target audience thought—doing an Open Card Sort with potential students, not a single person thought of the term Business.
When I conducted an Open Card Sort with alumni and faculty, the term most frequently used was "Company Partnerships," not " Business." I then decided to use Tree Testing to validate that term. Overall, it had a 95% success rate.
Tree Testing results for the term Company Partnerships
However, looking at the current navigation, you'll see the term Business. The Visual Designer felt the term "Company Partnerships" was too long to fit and went with the term Business instead. After speaking with the stakeholders, they couldn't make a decision so we decided to stay with Business for the time being.
We have the people, now what?
Normally, at this stage I would do task analyses and User Flows. However, after Tree testing the navigation, I felt that the flows and tasks were simple and clear enough that doing these were not necessary. Instead, we moved into wireframes.
Screens
Lessons
Learned
01) Don't try and do it all yourself.
02) Be patient.