V.04 Wireframes: Focus on Visual Elements

View Wires.

For this iteration, I focused on the visual elements of the wireframes including changes to font type and size. To ensure the type wasn’t distracting,  I decided to go with Gotham which has a clean look. When reviewing this iteration, take note the following visual improvements: tightening of the header and global navigation bar, improvement of spacing and shading, and different line weights to indicate visual hierarchy.

To foresee future growth of Progress University, all of the MBA programs are now nested under one main header navigation that could easily be added to.

With a continued focus on elements and style I changed the shading and spacing.  This made a world of a difference.  What originally looked like a canvas with a ton of white space is now filled with new features such as pictures and videos shown by elements of grey scale.

All of these changes were made with the intention of providing consistency and overall hierarchy of information.

Overall, this iteration is a big leap forward on the visual elements. In user testing and presentation feedback, it was clear that this version sacrificed a bit of functionality. This version held form over function. The next iteration will combine these successful elements with a keen focus on usability. That’s all for now. See you next week for V.05 of the wires.