Portfolio ⮞ IIW Website Redesign
IIW Website Redesign
Project Overview
UX 2011 Interface Design I
Team of 4
October - November 2022 | 3 Weeks
In my Fall 2022 Interface Design class, my team of 4 was tasked with redesigning the International Institute of Wisconsin’s (IIW) website. We met with the CEO of the organization to discuss problems the organization had with the site and used our interface design knowledge to present an updated site design.
Project Goal
Our goal was to unify the experience of the IIW site and update it to fit current best practices in web design. Our final deliverable was to present our design process and final high-fidelity wireframes to the client for additional feedback.
Personal Contributions
I completed the majority of the work for this project, partly because I enjoyed working on it so much. I contributed to the success of the project by:
- Lead the team in design discussions: I used my knowledge and inspiration from the assigned readings from class to get my team talking about what features to include in the new design along with other graphical design decisions.
- Identified issues with the current design: I worked with my team to identify issues with the current site that broke common practices or decreased the site’s usability for the target audience in addition to the client’s initial problems with the site.
- Created a style guide: I created a style guide/template page for my team members to use to ensure all pages were cohesive. These design decisions were driven by the team’s previous discussions.
- Restructured and redesigned site pages: I did the majority of the restructuring of site pages in Adobe XD to end up with a clean and unified site design that follows Gestalt principles.
- Ensured functionality of wireframes: I was in charge of making sure every link, button, and scroll box functioned as intended before our presentation to the client.
- Designed final presentation: I created a slide deck that matched the client’s branding and created a storyline of my team’s process to deliver an engaging and visually appealing presentation.
Project Results
Of the five presentations delivered in my class, my team’s presentation was the only one to be viewed in-person by the client. He was incredibly impressed by our professional looking wireframes and did not have any immediate problems with our proposed design, and our professor had to work hard to find any small errors that needed to be ironed out.
High-Fidelity Wireframe
The Adobe XD file is embedded below, and is also available here.
Presentation Slide Deck
View the slide deck as a PDF here here or click the image below.
