OVERVIEW
Brief: re-imagining NYU Welcome Week promotional materials in the form of a digital interactive billboard.
Challenge: creating new communication design for presenting orientation information and advertising student activities by incorporating graphic motions and interactive elements on top of the already well functioning annual user experience.
Solution:
3 motion sequences, advertising orientation activities/events and student organizations
added interactive element to create a more engaging and meaningful experience for users
Role: Individual project
Credit: All university campus related images and some orientation information references used in this exercise belong to New York University.
PRELIMINARY RESEARCH
▪️Did you know?
28% of NYU first-year students are international students, representing 117 countries
Among American students, 49 states are represented by the student body
A large number of students came from around the country and all over the world. Navigating a new city and a new campus must have been a little intimidating, especially during first week of college experience. As a result, having orientation information posted or advertised at different locations on campus would probably be helpful to many.
▪️NYU Mobile - existing platform for orientation event information
NYU Mobile is a smartphone app where all orientation event information locates.
NYU Mobile helps students organize events throughout their welcome week.
The event list could go on to over a hundred items which can be overwhelming.
▪️Existing orientation week billboard design
Current billboards for Welcome Week:
are usually displayed on flat-screens inside a few main building locations
are slideshows of eye-catching posters
do not offer interaction with viewers
❗️ Thoughts / reflections from preliminary research:
One of the best ways to have consumers remember and form connection with a brand is to have them interact directly with it. Should Welcome Week billboard include some form of interaction with students in order to create more engaging communication?
Among hundreds of contents [including orientation events and/or student activities], how should the different types of contents be selected to be displayed on the billboard?
How can advertising information [for orientation events and student organizations] be designed to create a more meaningful experience for students than simply slideshows of images?
UNDERSTANDING STAKEHOLDERS
▪️Stakeholder Interviews
I identified three groups of stakeholders whom I wanted to have conversations with in order to gain a better understanding of their current experience as the receivers as well as producers of orientation information during Welcome week. This will help me start thinking about how a new digital billboard design can help enhance such experience for the end-users.
(1) Incoming Students | main stakeholders, target end-users of the experience
(2) Friends and Families | important supporting stakeholders, emotional support for students, also with interest in certain welcome week activities
(3) Welcome Week Event Organizers | important supporting stakeholders; these are the people behind welcome week's contents and events with a clear vision and purpose of helping new students feel welcomed and inclusive during first week of school
I created three (3) sets of questionnaires, each of which includes questions specific for each group of stakeholders. Interviews were conducted over the phone and in person.
▪️Personas Development
The stakeholders came from all different backgrounds, and were able to share stories of their Welcome week experience, feedback on how they felt about utilizing available resources of orientation information.
❗️ Thoughts / reflections from stakeholder interviews:
Students mostly struggle with prioritizing orientation events while trying to plan their welcome day or week in the most efficient manner
According to all stakeholders, it is important that students feel a sense of community and belonging via participating in welcome week activities and staying up to date with upcoming events and opportunities to get involved.
How can a digital billboard help address some of these concerns?
IDENTIFYING SOLUTION OPPORTUNITIES
▪️Opportunities from Users' Stories
Listening to stakeholders' stories and trying to capture them in high-leveled storyboarding, I was able to appreciate different scenarios where an informative digital billboard can potentially become a great solution to alleviate some of the concerns we talked about.
DESIGN CHALLENGE
" How can I create a billboard experience that is not only an advertising tool for orientation events and student activities, but also a source of information to help students plan their hectic welcome week, while including engaging interactive elements ? "
DESIGN APPROACH
▪️Ideation
▪️Solution Approach
▪️How does this solution approach appropriately address the design challenge?
WIRE-FRAMING
▪️Wire-framing with low-fidelity paper prototype
USABILITY TESTING
▪️User test with paper prototype
Conducting usability test at this stage, my goal is to determine early if:
(1) content flow makes sense,
(2) conversation design of text contents is meaningful,
(3) balance between text - graphic - image contents is effective,
(4) overall structure of information and user interaction are efficient.
User test participants are both students and students' families/friends. Some of the feedback include:
"I like that the billboard is interactive, and that draws my attention."
"This part should sound more friendly like talking to the students and wanting to help."
"I didn't think I would see this when I tapped here..."
❗️ Thoughts / reflections from user test 1:
While interaction with the billboard may help delivering information more effective and engaging, and users may enjoy such interactive elements, they prefer an appropriate amount [i.e. not too much tapping or touching screen, or having to make choices when it's not necessary].
Users want information but don't want to look at too much text
Conversation design of certain text contents needs improvement. Users would like them to be more daily conversation-like, making communication of information more engaging and effective.
Since the end-product is highly involves motion sequences of contents, it was difficult for users to imagine or visualize the experience with this prototype. Thus, it is time to quickly move on to assembling high fidelity prototype so we can test other elements of a motion sequence such as timing, and transitioning between contents etc.
PREPARATION FOR HI-FIDELITY PROTOTYPING
▪️Billboard structure:
With a lack of experience in designing billboards, I researched on shapes of billboards, how to best divide between sections for view-only elements, and for interactive elements. My thought process is based on these questions:
(1) Which area on the billboard is appropriate for view at an adult's eye-level?
(2) Which area is appropriate for interactive touch within arm's reach? etc.
I decided to design a vertically structured billboard, mounted on a base on the ground, since it is more appropriate for:
(1) view and communication of information at human eye-level
(2) interactive touch within arm reach
Without any specific dimensions, for the purpose of this exercise, the billboard design will facilitate the following overall experience:
▪️Visual design guidelines:
Color theme:
Purple + White: NYU university color theme
Bright Yellow + Green: colorful, fun, uplifting vibe for Spring time, and semester kick-off
Font: Avenir - heavy
▪️Icon design for interactive element:
Shape: clock like, representing a timer or reminder of schedule
Number of minutes "15" and "30" with pointers: representing the time left until event starts
Smaller number inside the green square: number of events coming up
▪️Transitions + Connectors between Contents:
Lacking experience in motion design, this will be a challenging yet great learning experience.
Transitions is an element that will require validation from users to make sure the transitions are logical. However, for now, I will pursue the following approach
Conversation-like, friendly recommendations of events or activities, stating why the event or activity may be a good fit for the users
Relevant images in between, to help users imagine what the student activities or organizations may look like if they are interested
▪️Time - delays - durations:
Trial and error process as high fidelity prototype is developed and tested and validated via user tests before final design.
HIGH FIDELITY PROTOTYPE
High fidelity prototype is created with Adobe XD.
▪️Overall division of content sections:
▪️Featured Orientation Events:
▪️Featured Student Clubs and Organizations
▪️Branding Images and Promotional Texts
User Test
▪️Final User Test:
For this final user test, I asked for user feedback to validate the following elements:
How is the flow of information?
How is the pace? Too fast? Slow?
How is the balance between text, images, animation?
How is the transitioning between contents?
How useful and engaging is the interactive element? Should it be there?
Thoughts on the selected contents?
What is the overall mood or emotions evoked from watching the billboard?
▪️Take-aways from Final User Test:
Overall pace was a bit too fast, need to give viewers more time
Animation was moderate
The amount of text was sufficient, not too much; however, some text parts still didn't sound like normal conversation and would need more editing
Users liked the interactive element. "Would be very useful if implemented..."
Overall, the billboard creates a feeling of excitement, showing events and activities while mixing them with nice relevant images
FINAL DESIGN
Final iteration includes primarily changes in delays between text contents, giving viewers a bit more time to read text. Some text contents were also edited to be more like day-to-day conversations, more relatable to user experience as a student.
*Click Play to check out each animation sequence.
FINAL REFLECTION
🌈Key Take-aways:
1. Research: unlike some other projects that I have worked on where I really had to explore , understand, and develop empathy for the end users because I was not in their shoe, in this exercise, I was that new student on campus couple months ago. This helped tremendously as I immediately started with what I knew, the resources I used at that time and recalling how I felt then.
2. User Interview: I really appreciated all the users for taking their time out to share what they do, why they do it, how they feel - valuable information for designing anything for humans. There were answers from some of the stakeholders, such as the event organizers, which I didn't not expect, and it was very insightful to hear new information, new experience that different people go through.
3. The learning curve: has been amazing, working on this exercise! A big part of that was due to my choice of designing a billboard and designing motions, both of which are new to me
Designing a billboard: I have never designed a billboard. I am sure there are many elements about the design process of a billboard that I could have done more research on and included. What raised a lot of questions for me was probably interactions between people and a digital billboard, given that interactive billboards have recently become more and more popular physical/digital means of marketing and communication. Overall, it was a great learning experience. I will continue to learn more about billboard designs and hope to work on another similar project in the future.
4. Motion design: I have also never designed motions or done research on motion design. After this exercise, I realized how much I enjoyed it, especially when I tried to incorporate interactive elements with motions on screen, not knowing if it was going to be effective. Until now, that's still a question I need to answer, by continuing to work on this exercise and explore further user journeys upon interacting with the billboard.
5. Conversation design: is also a crucial aspect in this exercise. Being new to designing advertising materials, it did take me some time to find inspirations, for what to say, how to say it, then how much is too much or too little, through text on a billboard screen. Designing communication to be as close to daily conversation was an interesting task. Several times, really trying to think how I would say the same thing to a friend in real life, or how I would feel about seeing a friend after a long time, was very helpful.
6. Visual design: Initially I thought this would be easy because by default, purple and white make up NYU's university color theme, so I thought I could just play with the two colors. However, there is a whole other site specific and event specific context around NYU: Spring time, welcome week, a fun atmosphere in an active environment, new students, etc. All of those aspects demanded something more than purple and white. In the end, I added two other colors and felt pretty good about my choices.
7. User Test: conducting several rounds of user tests and with different users made a big difference in my progress in this exercise. Not only did they help me fix certain features of the experience through feedback, oftentimes, I needed validation of my own observations, especially as I came close to final design decision.
8. Project management: working on my own required a lot of time management, as well as project goal and project scope management for this 5 day-project.
I learned so much and had a lot of fun working on this exercise. If I had more time to develop this experience further, I would be interested in learning how to incorporate assistive technology to support interaction between people with different abilities and the billboard.
Please visit: https://www.sonluu.com/nyu-welcome-week for complete post on this project. Thanks for checking out this project! Please share feedback and comments below.
Comments