How might we make finding the scientific information easier?
Developing a Website for Hickey lab research centre –University of Queensland
About Client
The Hickey lab conducts discovery and applied research on Australia’s most important cereal crops – wheat and barley. The group is situated within the Queensland Alliance for Agriculture and Food Innovation at The University of Queensland, Brisbane, Australia. Hickey Lab has a wide range of audience including university students, scholars, agricultural firms and researchers.
Project Aim and My Role
A website was needed to be comprehensive enough for research savvy people and yet digestible for the non-academic audience. This required a multifaceted approach, employing multiple processes and involving people with different perspectives on the subject matter. The navigability and information architecture of the website were the major challenges of this project as the Hicky lab staff were working on different research projects.
In this project, I worked solely as a UX designer and also delivered the final project on WordPress platform.
Key Methods & Deliverables
User Research
Developing Sitemap
Competitive Analysis
Wireframing
Developing Persona
UI Design
Card Sorting
User Testing
User Research & Affinity mapping
At the start of the project, I conducted user interviews with a few members of the research lab and four potential users of the Hickylab website in their faculty. I asked them about the common resources that they used and how they could find the latest findings in their field. I also asked about common problems they were facing while seeking more information on their research field topics. The collected insights were then organised into groups in an affinity map. Affinity mapping helped to identify common habits, needs and problems. Base on the collected information, I created four different personas.
User Personas
Based on the patterns identified in the affinity map, I came up with three key personas. These personas described a typical/potential user, their behaviour, goals and needs. Having a persona makes it easier to refer back to it during ideation and design decision making.
Competitive Analysis
During the user research I asked participants about the scientific websites and research labs that they usually visit. I used the 3 most mentioned websites as a competitor to identify common features across these sites and how they organised their content and the overall layouts, and any potential opportunities for Hickey lab’s website.
Card Sorting & Developing Sitemap
Since Hickey lab researchers work on a range of different research topics, it would be biased to sort the website’s information structure based on my assumption or even Hickey lab’s team knowledge as the final user of the website might use different terms and structure for seeking information. To make sure we provided an optimal website layout and navigation structure and prevented any information architecture problem to arise later, I used Hybrid Card Sorting. It helped to gain a better understanding about categorising the website’s information and how many navigation levels should be used underneath those categories.
During preparation phase first I had a look at a few similar research lab websites to come up with a list of categories and then talked with my client to prepare a set of categories that participants could use to organise the cards into. However since I had a plan to use hybrid card sorting, participants had an option to add their own category if they wanted to.
Having an option to add a new category helped to understand if users would use different wording to categorise a research topic. We used an online tool called OptimalSmart for card sorting. Card sorting were conducted both online and face-to-face with participants. Conducting a face-to-face card sorting session gave me an opportunity to ask some follow up questions to gain an impression about their mental models and how they perceived that information.
Based on the results of card sorting, I gained a rough idea of how to define the overall structure of the website and how to categorise the content. During a meeting with the client, they approved the design of the site map.
Sketching
Prior to sketching, I reviewed all insights collected over the exploration phase and, considered them during ideation phase. I used pen and paper to quickly explore several concepts for the website layout. This was the easiest way to generate a volume of concepts and iterate each idea.
Reducing Cognitive Load
During the design phase I was mindful of the user’s cognitive overload as some of the content was so technical. I tried to keep the design of those pages simple and consciously reduced number of visual clutter to let users’ working memory process content information instead of dealing with visual distractions.
Wireframes
After sketching, I used Balsamiq to generate ideas and to prepare wireframes. I developed series of simple wireframes to represent the structure of different pages and the hierarchy of key elements. Wireframes provided an opportunity to discuss ideas and layout of each page with the client and helped to avoid spending unnecessary time on designing and developing pages that the client did not approve. I had a meeting with theclient to discuss and finalise the website layout.
Developing design guideline and UI Design
I defined a design guideline for the website according to the Google Material Design principles. After a thumb’s up from the client, I began designing the User Interface(UI) for each webpage.
User Testing
To evaluate how users would engage with the proposed website solution and to identify the potential problems, I created the website prototype in InVision for user testing. I conducted face-to-face user testing with four research students and fellows of faculty of Science. I used Tree testing approach for developing user testing tasks and asked participants to find certain research information in the clickable prototype.
It was asked from participants to think aloud while finishing tasks and I asked a few follow up questions at the end of the user testing to understand more about the user’s interaction with prototype. Based on the received feedbacks, I changed the layout of a few pages.
Conclusions
The main aim of this project was to design a website with an information architecture structure that could provide users a clear, intuitive and user-friendly experience. I used different UX research tools and techniques to ensure the final project met the user’s mental model.
This project was the begging of a great collaboration that I had with this client, as we worked on a few other projects together.
