BIO5 – Persona Building and Website Redesign

The Brief & Background

I was asked to provide support for the process of building a new website that incorporated 3 existing sites. The clients needed a new navigation and were unsure of what their audiences were seeking.

What I Did

I moderated persona-building workshops and built approved personas for the BIO5 team. These personas produced user-driven navigation.

I built mindmapping and wireframes from BIO5 graphic designer site comps. I built design file hand-offs for the developers calling out function, interactivity, look and feel. I demonstrated functionality to the clients using Adobe XD to mockup a site prototype.

Key Tools and Deliverables

• Moqups
• Freemind mindmapping
• Adobe XD
• Adobe Illustrator
• Persona workshops
• Personas
• Design handoff files
• Wireframes

The Team

Clients – BIO5 Institute communications team
The web development team – Eden Jeager, Leland Boeman, Bonnie Jean Michalski, & David Pichevin
Persona moderator, UI/UX design – Gianna Biocca

Results

The personas acted as an empathy building tool in meetings about the site. The wireframes and mindmaps were good starting places for the BIO5 team to build on with the support of the webteam. I presented the persona-building workshop tactics at the UX@UA meetup group (a group I helped create). It has 263 members and I’ve presented and moderated 4 events. The design handoff files were built with the developers’ input and fine-tuned for our process. The second file had no back and forth questions after the handoff.

Testimonials

“These are the best design handoff files I have ever worked with”

– Developer

“This is what a good website looks like”

– Digital Marketing Manager