GAYLE
BARTON
Sr. User Experience Designer
Sr. User Interface Designer
Digital Design Manager
MAKE IT REAL
PROJECT GOALS
The campaign, which was developed by VCU University Marketing, emphasizes the idea that learning, research, creativity, service and discovery — the hallmarks of the VCU experience — don’t happen solely in the classroom. They happen everywhere. “Make it real” celebrates the university’s connection with the outside world, its engagement in a thriving urban culture and its active role in fostering the talents and expertise needed to make a difference wherever people feel most needed.
PROBLEM STATEMENT - ASKED QUESTIONS
How to have an emotionally driven digital approach to VCU branding the can help create meaningful connections with potential undergraduate students and can positively influence choice.
MY ROLE
As a UI/UX designer, my deliverables included whiteboarding, wireframing and a high-fidelity prototype. I pitched UI concepts weekly to a creative team that included a creative director, developer, copywriter, social media expert and a marketing director.
​
UX RESEARCH
As a team we had a series of brainstorming sessions. This was a great way to generate a lot of ideas that I recorded with a whiteboard pen and on a whiteboard. The intention of the brainstorming sessions was to leverage the collective thinking of the team, we engaged with each other, listening, and building on each others ideas. I was the facilitator of these brainstorming sessions. I succeed in helping the team steer towards the goal by keeping the user, the user’s need and the team’s insights about them in a problem statement at the front of the team’s minds.
PRESENTATIONS
I took the notes I had from the brainstorming sessions and presented three major UI designs to the creative team:
Idea 1
An animated, fun website that displays a web of icons representative of VCU’s 84 academic degrees and disciplines. The audience could submit photos or videos that represent the users “it” to add to the site, and color coding would filter like interests. The team decided that creating 84 individual icons to represent each degree or discipline was not feasible. Back to the drawing board.
Idea 2
An interactive site designed to function as a social media channel. Using an existing Tumbler API, I’d create an interactive wall and invite users to create their own window on it to shows what “it” they are making real. Users could comment on each other’s “it's” and a mapping feature would filter like-minded posts to facilitate connections. Development time made this idea prohibitive.
Idea 3
Using the bold, candid images from the original “Make it real” website on a large grid wall system, adding white space and linking each square to a user’s personal “How I made it real” pop-up page that could be shared on social media. This concept was selected. I designed the UI for mobile and tablet.
FINAL THOUGHT
It was a challenge to narrow down the opinions of a large team to a unanimous UI design. The site has strong user engagement, with ongoing digital and print ads driving repeat users to the site to share the users “it.”
DESIGN TOOLS
Adobe:
Photoshop
Illustrator
Adobe XD
UX TECHNIQUES
Huristic Reviews
Collaborative work sessions
Spreadsheet building
Documentation
IDEA 1
First idea was to be an interactive web of degrees. When asked what is your it the user would be able to add their "it" and an icon to the web. | First idea - exploration on the "it" icon. As a team we agreed this would be to confusing and nearly impossible to implement. | First idea - exploration on how to spread the word on campus. |
---|
IDEA 2
Second idea - was to create a web site using an existing Tumbler design. User can post their own "it" window. | Second idea - exploration on how do you ask the user "what's your it" |
---|
IDEA 3
RESULTS
The project asked users a simple question: “What’s your ‘it’?” The prompt plays off of VCU’s “Make it real” campaign. The cornerstone of the project was a website where students fill in the blank in “Make ____ real” to share their VCU story.
​
Back to sketching and wire framing the third idea. | Wire frame the third idea, a picture wall was the main focus. | Third and final idea - Wire framing the UX for the mobile version. |
---|---|---|
Third and final idea - User posting "tell us how you make real". Using 35 existing VCU pictures in a grid wall to start off with. Currently it has over 100 postings. |
BRAND CENTER