- Client: Dallas County Community College District (DCCCD)
- Target audiences:
- Students, prospective
- Integrate nine higher education websites (with different designs, navigation and platforms) into one cohesive portal
- Design navigation and web elements to intuitively aid the user in finding the information they seek
- Allow the different colleges to retain some sort of branding elements on their sites
- My roles/responsibilities in this project:
- UX researcher
- Interface designer
- Visual designer
DCCCD consists of seven independently accredited colleges as well as three service locations. Each college had its own website, running on completely different platforms, using entirely different technology, with wholly different navigation and structure.
The inconsistency proved to be very problematic for our students. The main goal of this project was to solve that very problem. However, we were only given a timeline of six months to do so.
Research & Discovery
We began the process by sitting down with each of the college web teams to discuss goals, target audiences, needs and any user feedback they happened to have.
We continued by researching by conducting focus groups, interviews and card sorts with:
- High school seniors at two different high schools
- General members of the community
- Clients of Metrocrest and CitySquare
- Current college students
We also performed navigation audits of the currently-existing college websites.
Design & Development
Based on all of our findings, we put pencil to paper and began sketching out possible solutions for a header design for both mobile and desktop views. We knew that previously, college headers can be a bit heavy with text, links and buttons. Our aim was to simplify the header and offer a bit of white space to help lighten the cognitive load on the user and not overwhelm them.
High fidelity mock-ups were soon developed to further sell the concepts to stakeholders:
We combined some of the best, workable ideas and performed some preliminary usability tests on paper to develop our final approach:
Color patterns were developed for each of the colleges to theme their versions of the site:
Colleges Menu on All Screens
Header and Footer on Tablet
Header and Footer on Mobile
Interior Page on Desktop and Table
Interior Page on Mobile
Landing Page on Mobile