Don’t get married to your work — make iterations to it.
People say that you’re your worst critic but sometimes, nothing hurts more than getting critiqued by someone else. Even when you understand that they’re just trying to help, it’s still a little discouraging to know that there’s flaws in your work that you put a lot of effort and time into. Flaws are inevitable and we need to simply…accept it.
As aspiring UX designers, my professor always emphasizes in class that “You can’t get married to your work.” This couldn’t be more true. We should be constantly making iterations to our projects to improve it. Constructive criticism is what allows us to gain enhanced perception — it lets us see issues that we didn’t see before. A project that I’ve been working on since last year has given me insight into the importance of being open to new ideas and designs. I will discuss the design process of the project that my team and I went through (below) and how we came together as a team to decide on which design we wanted to invest in the most.
Utah Film Schools Website Project
A Brief Overview
The process of choosing a program for any major can be extremely stressful and time-consuming. Although schools like Utah Valley University (UVU), Brigham Young University (BYU), and the University of Utah (U of U) all offer information on their film programs on their website, having to look back and forth between each site can be a tedious task. We needed a place where prospective students and parents were able to easily compare the film programs at these schools.
Planning & Discovery
When starting a new website, it is important to interview the stakeholder to gain a better insight into what they really want and expect. Before we began designing the website for our stakeholder we first conducted a stakeholder interview with him. In this interview, we asked him questions that were related to the purpose or vision of the site, the audience, usability objectives, and his expectations. By conducting this interview, we were able to not only identify the key components that we needed for the site but also figure out our target audience.
Goal
- Originally, the purpose of this site was to create an online presence for solely Utah Valley University’s (UVU) Digital Cinema Program. Since their current online presence is very minimal, it makes it difficult for our target audience to gain access to information they need about the program. However, due to some complications, we had to alter the original plan to something that was broader — something that wasn’t directly tied to UVU’s site.
- Instead of creating a site that only advertised UVU’s film program, we decided to create a review-type website that provided prospective students with information on the Utah film programs offered at Utah Valley University, Brigham Young University, and the University of Utah.
Target Audience
Who will be visiting the site? By researching and taking the feedback that we got from our stakeholder, we came to the conclusion that our target audience includes prospective college students, current college students, and the parents of students. Once we were able to pinpoint our target audience, we then focused on our design principles.
Research
Why will people choose us over the alternative? To understand what our users were really interested in, we created survey questions that we could use to gather data on our audiences’ attributes and the features and content of our site. To create a web version of our survey, we used Typeform. We then posted the link to our online survey on each of our individual social media accounts; as a result, we were able to get close to 100 responses. The results of our survey are shown below.
Out of the 122 visits that we had on our survey, we received a total of 97 responses. As shown in the pie graph above, it is apparent that a majority of the people who participated accessed the survey through their smartphones. The second most popular way people accessed the survey were through their PCs and laptops. We also found that 44 out of the 97 people who took the survey answered that they were college alumni. On top of this, the most important information when considering a program was the available programs a school had, not necessarily the alumni or professors. Other things we found were that what makes a website trustworthy to a user, is the ease of
navigation and that the second most popular way that people decided/will decide on a college is through the school’s website.
Pivot Plan & Strategy
This was one of the hardest stages that we had to go through as a team because we weren’t quite sure what our client’s new expectations were. However, after a class period of brainstorming, we came up with elements that we wanted to include in our new website. As shown below, we decided to include sections like “Awards”, “Programs”, and “Alumni.” Later on, however, a new team and I had to iterate the sections again; we included sections on “Work”, “Awards”, “Catalog”, and “Advisors”.
Design Principles
We were inspired by three main design principles: Simplicity, Giving the People What They Want, and the WOW Factor.
Persona
We came together as a team to create a more primary persona — Alexander. Having a good understanding of who your potential users will be is important. Even though personas are fictional characters, creating a realistic representation of your target user is highly beneficial since it aids in designing for a more specific crowd, rather than a generic everybody.
Scenario Map
Creating a scenario map of our primary persona, Alexander, helped us understand what type of steps he would take to complete a specific task. Outlining a scenario map is simple: post-it-notes. With different colored post-it-notes, we outlined Alexander’s steps, questions, comments, and ideas.
Scope Draft
We then created a draft of the final requirements/features for our website:
Site Map
The site map is the architecture diagram of the site; it represents the relationship of all the major pages on the site by using lines and subordination to show relationships among pages, and by using appropriate descriptive labels for each page. We kept the layout of the website extremely simple so that users could navigate to certain pages without any confusion.
Building-Time
After getting a good feel for the project, we began designing. Although everyone in the group came up with their own set of wireframes and surface comps, we ended up using the following design to build our website.
Wireframes
Creating wireframes helped us visualize the framework and overall layout of the site. Shown below are the wireframes that have been adapted over time to fit the needs of the site. By the fourth iteration, we decided to include a call-to-action button, “Compare All Schools” to help our audience to easily access general information about the film programs at UVU, BYU, and U of U.
Style Guide
The style guide is what helps define and keep a design consistent and cohesive. In this style guide, the color palette and the typography are defined. Why is it important? A style guide is important since it acts as a guide to how a project is supposed to look and ensures that everyone on the team is on the same page.
Surface Comps
Like the wireframes, we had to keep iterating the design. It’s a looping cycle, but this is what the end results came out to be.
The Take Away
From start to finish, a lot has changed. Overall, the end product of my team’s project turned out very well. Even though the project did not turn out how we had expected it to be in the beginning, during the second round of the ideation stage, we were still able to come together and work efficiently to meet deadlines and produce something that was not only visually pleasing, but functional.
Having to pivot from the original plan to meet the client’s new needs was a good experience since the industry is like that; projects don’t always follow through with the intended timeline due to complications. Going through the process of brainstorming again, coming up with a new plan, and redesigning (more than halfway through the semester) honestly gave us all good experience with working with others and I feel like it made my team even stronger.
The key to improving as a designer is to not get married to your work and to collaboratively work well with others. Seek constructive criticism and let your designs evolve. Gaining insight from others helps you gain enhanced perspective and allows you to explore different options to make the project the most effective, visually appealing, and easy-to-use product. Very rarely is a project ever completely “finished” or “perfect”, so get feedback from people who provide helpful critiques rather than those who either raves about how great your work is or simply tells you that it’s not good without giving any reasons or suggestions on how you could improve.
To view the most up-to-date mobile prototype, click here. If you would like to also view the desktop prototype, click here.
Ellie Hoyt is a student in the Digital Media program at Utah Valley University, Orem Utah, studying Interaction & Design. This article relates to making iterations to your work in the DGM 2240 Interaction Design and DGM 270R Digital Design Practicum courses and is representative of the skills learned.
