I-ETC Conference Website Build
Earlier this year I had the exciting opportunity to collaborate on a website design from scratch for the brand new Intermountain Engineering, Technology & Computing (I-ETC) Conference. Utah Valley University (UVU) will be the first University in Utah to host the I-ETC Conference which will take place in May 2020. After that, UVU and other prominent universities in Utah will take turns hosting the event.
Designing the Logo
To get our creative juices flowing for logo designing, we started with a quick brainstorm session and jotted down everything Utah was known for. Mountains are a big part of Utah living. The “I” in I-ETC stands for “intermountain”. We quickly concluded that mountains would be part of the logo, and got working on sketching out ideas.
For the color scheme, we wanted to honor the main universities that would be hosting this event. The colors red, green and blue would represent each of them, and would be our color scheme. On a lighter note, it was also a play on the red, green and blue “RGB” color values which are supported in all browsers thus used extensively in web design.
User Research
The next steps were to create vectors of our different logo ideas and get some feedback from real people. A great logo is one that looks great in black and white as well as color. Although we had a color scheme, and had colorized our logos initially, at this user research stage we agreed that colors would be distracting. It could potentially introduce a bias based on people’s favorite colors. When we conducted user research, we used black and white versions of our logos.
Our logo user research took place in the Computer Science building at UVU. We approached students in a professional manner, briefly introduced ourselves and our logos, then asked if they would take part in a brief survey. If they answered yes, we asked which logo was their favorite and which one was their least favorite. For reference, we wrote down their names and which program they were currently enrolled in. We then tallied up the points for each logo. Logo #6 received the most points, and logo #5 was a close second.
Landing Page
After securing a website domain, we turned our attention to the landing page where we started collecting emails from prospect I-ETC Conference attendees as well as informing visitors to the page of the conference’s important dates.
Site Map
Site maps represent the hierarchy of content on a web site. We created a site map that shows the I-ETC website primary structure, and a navigation strategy.
Mood Board
We conducted a competitive audit where we looked at other conferences websites and what we thought they were doing correctly and incorrectly. With that, we put together a mood board with these examples and used it as input into the design process.
Wireframes
In order to start designing wireframes for the website, we asked ourselves two important questions, “what type of information should go on each page?” and “what are their relative priorities?” So, for example, for the landing page we needed the following: a form for people to submit a file, information about the event, and a “get update” button that would collect visitors’ email addresses. We established that getting people to submit their files was our top priority and call-to-action so we placed it prominently on the page to draw attention to it.
Surface Comps
Moving on to surface comps. This is where we injected our color palette to create visual hierarchy. We grouped related images with text, labels, titles and other elements bringing the design to life. Our pages looked and felt like a real website and allowed us to showcase to our clients how real the website might look.
After final iterations on surface comps and prototypes were finished, we were ready to deliver our designs — along with other materials such as a style guide, assets, and documentation — to web developers who would build the website.
This project was created by a team of three people — Josh Wilsher, me, and our mentor Dan Hatch.
