Company:
VisionPoint Marketing
Design Duration:
10 months
Responsive Web Design
Homepage
The homepage functions as the start of an institution’s experience in most cases, showcasing the academics, student life, and unique culture to prospective students. It is one of the most important page types to increase student engagement. For UTD, this meant highlighting the vibrant and nerdy culture the school is knowing for along with showing off the campus architecture/scenery, exciting news/events, and campus life.
Desktop
Mobile
Additional Page Types
Gateway Page
This page type offers more information on a specific audience type like the faculty and staff at UTD, as shown in this example.
Desktop
Mobile
Program Listing Page
This page type showcases all the various programs at UTD by degree type and by school/program with links to individual program pages for more detailed information.
News Listing & News Story Pages
The News Listing page type shows a featured news story along with a listing of other news stories to date with the ability to filter and search. The News Story page type shows an individual news article featuring various components like social sharing, photo gallery, and related stories.
Microsite Homepage
This page type will be utilised by clubs, organisations, and other initiatives at UTD that require a more robust representation of content. This homepage resembles the main UTD homepage, bringing in similar elements and styles for a unified design.
Process
After thoroughly grasping UTD’s goals and strategies for this website redesign, the creative director and designers brainstormed visual directions for three concepts to present to the client. The energy and vibrancy of UTD sparked many creative explorations that heavily utilised animation and interactivity. I envisioned text and photos floating over one another or fading in and resizing as you scroll down the page. Bright colours, bold type, and playful textures were my go-to for these initial designs. The final product of these explorations was a screen-by-screen approach, where the initial viewport functions as a carousel housing all the homepage content, so there is no vertical scrolling.
Initial homepage design explorations
After many check-ins with the creative director and project team and vetted by developers, the design concepts were presented to UTD, who pushed back heavily on the use of too much animation and interactivity. With this unexpected reaction, we went back to the drawing board and presented more toned down, but still visually dynamic and energetic designs. UTD was very pleased with these options, and after many iterations and refinements, we achieved the homepage design that you see presented above.
With an established homepage design, the remaining page types were designed using similar visual styles with unique components specific to certain pages. These page types are essentially templates that UTD will use in their content management system (CMS) to show different types of content. The page types include a Standard Inner component page, Gateway page, Microsite Homepage, Microsite Standard Inner page, Directory page, Program Listing Page, News Listing Page, and News Story page. All website designs at VisionPoint meet Level AA of the Web Compliance Accessibility Guidelines.
We delivered the page types in batches of 3-4 pages, and I guided UTD directly through the designs via progress presentations. For each batch of page types, UTD provided feedback and discussion that were worked into the many iterations of these pages before yielding the final designs displayed above.
As each batch of pages got approved by UTD, they were passed to development after being thoroughly annotated via Zeplin. During this phase, I heavily collaborated with developers to make sure the built pages matched as closely to what we showed the client in design. This continued into design and functionality QA as well, in which I tested all the pages across various browsers and devices, submitting tickets via Bugherd for issues large and small all the while having productive discussions with developers on refining the designs.
Reflection
Overall, the project is a success and UTD is extremely satisfied with the project so far. It’s always humbling to see a client so happy with our work, and it fuels me to continue learning and growing to embrace the users, their needs, challenges, and desires to create an exceptional end product. While there were a few hiccups at the start of this project, we managed UTD well and delivered what they were expecting to see the second time around.
Looking back, UTD could have benefitted from a “design spectrum” exercise, which is something I was advocating for but wasn’t in our scope of work. This exercise presents about 10 websites that match the client’s personality, and the client then decides where they fall on this spectrum in how they expect to see their site designed. This helps the project team understand the visual style and direction for the site, including interactivity and functionality. Although this wasn’t doable for UTD, I learned that being open and honest with a client helps earn their trust, and this also allows for productive discussions that contribute to creating better designs.
In addition, this project taught me that sometimes there can be miscommunications between you and the client, which is why it’s so important to truly understand the client and users throughout the whole project lifecycle. I thoroughly enjoyed being in UTD’s progress calls and gained more confidence in my presentation skills by directly walking UTD through design decisions. By having a direct presence as a designer with UTD, I was able to understand firsthand their challenges, likes, and dislikes about the designs and even engage in candid conversations about their expectations. For these reasons, this website design for UTD truly helped me grow not just as a designer, but as a leader too.