As part of the design team for Zotcade 2019, my colleague and I were tasked with research and development of the event's website.
Zotcade is a student-run gaming festival run held at UC Irvine. My colleague and I were tasked by The Association of Gamers at UC Irvine, one of the campus orgs helping to organize the event, to redesign the Zotcade event website.
The website for the past year's event consisted of 7 different pages: Home, About Zotcade, Schedule, Sponsors, Tournaments, Zotcade 2017 Photos, and Directions and Local Hotels.
To begin our research, we asked poked around the old website to evaluate the purpose of Zotcade's website. Being unfamiliar with event website design, we needed to discover the website's purpose ensure our redesign fulfills that functionality. We listed the following as the website's goals:
The next phase of our research was the competitive analysis. The goal of this phase was to gain a deeper understanding of event website design and understand how the old Zotcade website compares to the websites of similar events.
The website for Beachcon 2018, a game festival held at CSU Long Beach. Displays information on the event, a map, and the social media links for Beachcon. Easy navigation, consistent color scheme, well-designed map.
The webpage for TomorrowLAN, a LAN held at the Université de Moncton. A single page website, with a navbar which scrolls your screen down the page. Poor navigation, system visibility, and unintuitive features.
The Anime Expo 2019's webpage. Displays information for the event, registration, trip planning and news regarding the event. Very high budget, well-designed user flow.
The website for Dreamhack Dallas 2019. Displays information regarding tournaments, the convention, trip planning, and news regarding the event. Poor navigation and cluttered pages.
By comparing Zotcade's previous website to these competitors, we were able to understand what the current website did well and what it did poorly. We were also able to take what these competitors did well as inspiration for our redesign.
To discover what can be improved upon with last year's website, we performed a heuristic evaluation with Nielsen's 10 Usability Heuristics. As a result of our evaluation, we found the following to be key potential improvements:
To begin the design process, my teammate and I individually sketched our visions for a redesigned website, keeping in mind what we found from our research. After presenting and discussing our sketches with each other, we compiled what we deemed optimal for the final design.
We created high-fidelity mockups using Adobe XD. We iterated on the design while getting feedback from The Association of Gamers. The final high fidelity mockups can be seen below.
Without a development team, it was up to us to deploy the website. Once the designs were finalized, we used Wix to bring our design to the web. The live website can be viewed using the link below.
Though this was a relatively small project, I had learned a lot from it. Given the lack of resources and limited time frame, our research did not involve users, but using what research methods we could, I believe our design was well informed. Working in a smaller team of two made for a more personal working experience where I could understand and discuss with my teammate more deeply. Overall, I am proud of the work our team has produced and am thankful to The Association of Gamers at UC Irvine for the opportunity to work on their event's website!
