VCU BRANDCENTER
While working at Virginia Commonwealth University, I was the lead designer on rebranding of the Brandcenter website and followed the design process concept to launch. I ensured the design was a companion piece to their new “secret society” branding and the web site was to highlight their reputation as one of the best Top Advertising and Portfolio School.
WHAT IS THIS SECRET SOCIETY?
They wanted a fresh look and it was their 20 years anniversary, and some of the alumni had been saying that it had been like they were almost a secret society of sorts – that after 20 years, it’s like they embedded these alumni in these businesses like Google and Facebook and agencies, and after 20 years they had moved up into positions of leadership.
DESIGN TOOLS
Adobe:
Photoshop
Illustrator
Adobe XD
UX TECHNIQUES
Personas
User journey mapping
Card-sorting
Discovery Sessions
Wireframe sketch sessions
THE GOAL
Was to create a fully responsive website to serve as the Brandcenter’s first look to attract hungry, diverse, highly competitive and talented students. Also give recruiters a view to their recent graduating class portfolios. This was a 2 year, full time, Masters Degree in Business with 5 different concentrations. It was fun to create the design’s look and feel that reflected a "secret society" where only 15 were accepted for each concentrations.
Icon design of the 5 concentrations
Branding by Cabell Harris from Work Labs
MY ROLE
I was on a team that consists of the Hawley Smyth, Senior Admissions Counselor and Cabell Harris, Brandcenter Professor, along with a content strategists, a developer, a digital director, a photographer and a videographer. I was the User Experience and User Interface Designer for this project, leading user research, design, testing, and implementation.
SCOPE & CONSTRAINTS
Investigated the current problem by auditing the existing website by doing a heuristic review, along with a user questionnaire, a UX competitive analysis, and took into business objectives as considerations. Presented my UX insights as User stories and User personas.
USER INSIGHTS & IDEATION
Lead a discovery and sketch sessions with the team to uncover insights, we worked out ideas quickly and I translated the concepts into wireframes. Took these wireframes and did user testing on 5 Brandcenter grad students and 5 recruiters to make sure we addressed the users’ needs and motivations. Correlated user testing results and made changes to the wire frames where it made sense. Presented my findings to the team and got buy in to proceed to the next step.
EXPERIENCE STRATEGY & VISUAL LANGUAGE
I created a responsive, desktop to mobile web design, and Low-/High-fidelity prototypes, following with a design system documentation. The new iterations based on stakeholders and peer review resulted in a polished UI.
END-TO-END DESIGN & EXECUTION
I executed idea to concept, UX research and wireframes, low-to-high fidelity prototypes, and conducted user tests.
THE GOALS & CHALLENGES
-
Make the current web site mobile friendly
-
Make sure the design was a companion piece to their new “secret society” branding.
-
Get buy-in and approval from the stakeholders, Brandcenter Communications Director and a Brandcenter Professor, Cabell Harris.
THE DESIGN PROCESS
DISCOVER - - -> DEFINE - - -> DESIGN - - -> DEVELOP - - -> DEPLOY
As a team we worked in the 2 week sprint cycle. The demo schedule lend itself to the schedule of the Communications Director and Cabell Harris. The team planned the project in an Agile / Scrum process by breaking the project down into smaller chunks. This allows us to focus on one module or content type or feature of a product before deciding what needs to be built next. Everything outlines in red was my roll and responsibility.
DESCOVERY SESSIONS
I lead the discovery sessions, used a combination of these techniques: brain writing sticky note, user flow bubble chart and brainstorming. After analyzing the results, we were able to set our goals, priorities and got laser focused on our audiences needs. Collaborate with the content strategist to work out a site structure using a card sort technique.
WIREFRAMES
I was the one holding the pen during these wireframe sketch session, where design, content and development got together and discussed Min and Max requirements. We followed the designed site structure and roughed in how the pages would function, discussed elements and content types where needed on each page and discussed the content hirearchy.
Admission page sketch session
People cards sketch session.
Friday forum sketch session
DESIGN SYSTEM
BEFORE AND AFTER
 Homepage |  Recruiters page |  Student & alumni showcase page. |
|---|---|---|
 Staff page |
EVALUATION OF ENGAGEMENT
Time spent on the site soared 49.35 percent, and sessions increased by 7.75 percent. The new site map reduces pages by nearly 50 percent (from 50 to 27 pages). Brandcenter saw a 15.7% increase in requests for an application to the school. They had to expand their placement number from 15 to 24 for each concentration.
LUCKSTONE