Summary

I worked as a website designer (contractor) for Dr. George Goshua of Yale University for a 5-week period starting in June 2023. I worked with Dr. Goshua on clarifying website needs, designing each page, and building out the website in Editor X from scratch.

Role: Sole website designer & Editor X developer
Time Frame: May - June 2023 (5 weeks)
Methods: Prototyping • Content Creation • Website design • Website architecture
Tools: Figma • Editor X • Canva

Here is a link to Dr. Goshua's Website: https://www.goshualab.com/

Background

Dr. George Goshua leads a hematology-oncology research laboratory at Yale University. He wanted a website that could communicate the purpose and significance of his research to collaborators and funders. In addition, Dr. Goshua wanted to highlight his mentees and his research team's successes to facilitate future research partnerships.

Goals

I wanted to ensure the website achieved the following objectives:

Capture Dr. Goshua's passion for his research work and dedication to his mentees
Curate his achievements in a way that makes it easy for someone to understand the purpose and caliber of his work
Create a website that is easy to maintain and update.

Ideation

We started by brainstorming the objectives for Dr.Goshua's new website. I proposed a simple website architecture so that we could have a map for building out content. I also made notes on how he wanted to use each page (i.e. "adding and removing team members") so that each page could be built out to accommodate future maintenance and updates.

Once we agreed on the website architecture, I propose content flow for each page. Next, I built out wireframes to propose how each identified section could be laid out. I provided several layouts for each section to get clarity and feedback on direction.

mid to hi-fi Wireframing

As the concepts for each page clarified, I created mid to hi-fi wireframes to present the design direction. The refined wireframes helped to identify areas for improvement.

For example, while the publications page seemed cohesive, Dr. Goshua wanted the capability to highlight or feature certain publications. I created several designs for how this hierarchy could be achieved:

Sort by featured first, then all other publications
Add additional information (image, list of recognitions, etc) and create a featured publications section to highlight certain publications
Create a filter that is defaulted to "featured" and allows users to select "all" to vew all publications

We decided on option 2, as that gave meaningful context to users (unlike option 1) and reduced interaction cost (unlike option 3).

Build & Launch

I learned the ins and outs of Editor X (a Wix affiliated content management system) to understand the tool's abilities and limitations during the designing phase. By the time the designs were refined, I was able to apply my newly gained familiarity to build the site out with custom modules. I also ensured that each page was optimized for standard breakpoints.

Here is a link to Dr. Goshua's Website: https://www.goshualab.com/

... & Maintenance!

Of course, I didn't want to forget the importance of creating an easy to maintain website! Each page was structured using Editor X's content manager, which allows a spreadsheet-view to modify existing content without worrying out UI or layout. Just in case, I created an instruction template that documented each process (which I'm proud to say is a maximum of four steps for updating any given page).

Final Reflections

Having started my career as an infectious disease researcher, I really appreciated ideating with Dr. Goshua on how to best communicate his research to a wide array of audiences. Portraying complex findings, especially when it has as significant implications as clinical research, really motivates me to continue testing with users on if implemented designs are effective at achieving user friendly design.

Another lesson learned? - I wish I looked more at Editor X's built-in templates as part of the wireframing process, as that may have saved some time in the build stage. Ultimately, due to Editor X's customizability, it was still great to ideate without any constraints. Working on this project helped me to appreciate the effectiveness of applying divergent and convergent thinking in the design framework. Each iteration involved thinking creatively about possibilities, then refining the solution to better the final product.

Building a website to highlight clinical research work