Virginia Commonwealth University - Make it real 4.0
Im going to walk you through the process.
Goal/Intent:
Solicit goals, dreams, desires and hopes from prospective students in the form of filling in the blank of “Make ____ real” by asking the question outright, What will you make real? What’s your "it"? These questions function as the conversation starter, but to actually become a conversation and build momentum into, a movement a community needs to get involved and grow.
My role:
As a UI/UX designer I had to create and intergrate many complex concepts that included wire framing, white boarding, interaction flows and finally, a high fidelity prototype design. I had to pitch my UI concepts weekly to the university relations director and a group of project managers, social media experts, art/creative directors, editorial staff, photographers and programmers. We would collaborate with brainstorming sessions and white board all our concepts - - even our silly ideas where considered.
The project had to address these UX Questions:
• How to drive recruitment of high-caliber students, faculty and staff to VCU?
• How can this become a two-way conversation and generate authentic content?
• How do we tell stories?
• What is the look and feel?
• How does the conversation live on different platforms? Digital? Out-of home? Broadcast/video? Events? Website? Social?
• How will this strengthen the connection with prospective students and parents?
• How do we make campaign meaningful to prospective faculty, current students/faculty and alumni?
• How do we tie in with recruitment efforts?
The team decided all the advertisements will lead to a web hub. The web site will be the cornerstone of the campaign.
1st UI/UX Concept:
The site experience was to be animated and fun. Students, prospective students, faculty, staff and community leaders can be involved by submitting their "it" word, photos, videos that get thrown up on the interactive wall with an icon and their word. Color would represent the many university disciplines and could be filtered to narrow down the users similar interests. I designed icons, but these UX question were brought up when I presented this concept: Will the user pick from a pre-set icons that represent their "it"?. How many icons would need to be designed. VCU has more than 84 degrees and disciplines. This concept was decided unfeasible.
1st UI/UX Concept:
The site experience was to be animated and fun. Students, prospective students, faculty, staff and community leaders can be involved by submitting their "it" word, photos, videos that get thrown up on the interactive wall with an icon and their word. Color would represent the many university disciplines and could be filtered to narrow down the users similar interests. I designed icons, but these UX question were brought up when I presented this concept: Will the user pick from a pre-set icons that represent their "it"?. How many icons would need to be designed. VCU has more than 84 degrees and disciplines. This concept was decided unfeasible.
Use allready existing make it real and add the make it real icon tags.
2nd UI/UX Concept:
An interactive web site which would function like a robust social media site. Use existing tumbler API to create a custom interactive wall. Invite the user to create their window on the tumblr wall. We ask, What now? How do you plan to make your "It " real?. By displaying all content in an engaging and eye-catching way, we want to encourage It community participation; get people looking at each other’s "Its", commenting and making suggestions, even teaming up. This will be aided by encouraging faculty involvement/mentorship as well. A mapping/connections feature could illustrate like-minded posts and facilitate connections. But the development of this concept would take too long and there were timelines that needed to be considered for a fall launch.
3rd UI/UX Concept:
I circled back to the original "Make it real" web site. The original site had dynamic, wonderful images. I decided to use these but put them in a larger grid wall system. Added more white space. The square boxes are linked to the users personal "How do you make it real" pop-up page. Their page can be shared across all social media sites. This concept was chosen. Now I had to design the UI for mobile and tablet. I created wireframes to help visually communicate mobile experience with team members and the developers.
Had to prepare a click by click mobile UI wireframe documentation. I desgined a responsive UI for desktop to tablet to mobile.
1. Press fill in blank button.
2. Press I make ______ real. text field to type your “Blank”
3. Keyboard pops up, Press next when finished.
4. Press “Say more?” text field.
Final web site:
https://makeitreal.vcu.edu/
Update:
UR received an honorable mention in the integrated campaign category for Make it real. https://www.ihaforum.org/events/award_winners.aspx?y=2015, We competed with more than 300 entries from national and international companies and organizations
