Right after I joined AVP, we assembled a team consisting of a designer (yours trully), a marketing coordinator and a front-end developer to redesign the website for the program. The reason was primarily the old website was built years ago and hasn't been touched -design wise- since then. Therefore it was time to give it a fresh look, update WordPress & Modules but most importantly, to actually think about the whole architecture in a new way, a more sensible structure for the users of this education facility.
The users needed an easy way to access the information they needed, and also be informed about upcoming events and other activities.
The main target audience for the AVP website is students of the Aalto University. Prospect students who are interested in pursuing the minor as part of their studies, as well as students who are already enlisted and need to register to the courses.
The importance of the website lies exclusively on functionality & information infrastucture because the students need to know about their courses, upcoming events and other relevant information to their studies. The biggest challenge was to identify & categorise the information that was scattered around before that.
Designing a website that would function as a hub for users who want to pursue the path of entrepreneurship was a fun however intensive & demanding task to do.
The process started with identifying the architecture of the website. That meant in practice, find all the links and pages already existing on the website and understand their purpose. Categorising them was equally important in order to create primary and secondary links (also for navigation purposes. This part of the process was done traditionally, using pen & paper, as well as sticky notes.
Based on user feedback (students) and benchmarking (partner universities like Stanford), we started digging into the wireframing while keeping in mind the latest trends and tools available.
After creating the first wireframes, again, with pen and paper, I started converting them in digital form on Photoshop. Those boxes gave us the first clue on how the website would form and now digital, we had the chance to iterate small things and tweak the information to make sense to everyone.
The next step was to start putting real content. With this we were seeing the website as we would expect it to be. The real content from the website gave us a visual that we could cross check with our benchmark examples and our expectations and again iterate on small changes to aid the functionality and accessibility of the website.
After the real contect I created pixel perfect mockups and as close to reality so that we could translate that to the first prototype. And so, in the end, the first prototype was created in close cooperation with the whole team for the project but also external users. It was invaluable in our process to include people who used our website in order to understand their own expectations from the old versions of the website but also the new.
Students have a website that they can actually use. Users feel encouraged to search through the content as the structure is more logical and visual. The metrics show a better rate of visitors (lower bounce rate), and we try to iterate on the website as often as we can, whenever a small challenge appears.
- Including users in various parts of the process is critical to a more successful result
- If data exists, make sure to make sense of it and include it during the decision making
- It's ok to start with a failing process as long as you can understand the mistakes and not repeat them