A full site redesign using mobile-first methodology for desktop and mobile. Increasing users by way of making the scholarly website more accessible to common people, while retaining its scholarly tone. A rebranding effort to share improvements with stakeholders.
Jodi Henderson, creator of the website SlaveFree Today for the NGO of the same name. Acting as a global collection of statistics and scholarly articles on the topic of Human Trafficking in an effort to end the practice of Modern Day Slavery.
2 weeks to complete redesign
Re-branding using colors that spoke to the global aspects of the site
We began the design process by each interviewing two or more of the former users of the website. I interviewed Lori Celaya and Davina Durgana both. They each wrote scholarly articles that contributed to the core information found on the site.
They felt that the site was easy to navigate, but that it could use a more transparent process of communicating when articles would be published and the steps involved in publishing an article on the site. The site needed to rebrand to become more accessible, but without losing the scholarly tone and they agreed that the introduction of iconography would be a good way of going about that.
Those interviewed had various relationships with fighting against modern slavery. Jason Wilkerson, a detective working in the human trafficking division, had a lot to say about the ways in which the site could be improved:
More accessible language used in the articles themselves
Easier means of finding the articles from the front page
A directory of people working in the fight against human trafficking
I handled the creation of the user personas for the site redesign:
I utilized the 4 main user groups for the site found in the interview with site creator, Jodi Henderson. The 4 user groups are Students, Front Line Workers, Government Agents, and Regular Citizens. Jason Wilkerson found himself suggesting the site to colleagues who find themselves suddenly working cases that develop into human trafficking situations, so the site needs to be accessible to people newly discovering these issues.
The student would need the site to be easily accessible via mobile, and have readily available to download articles. The government official would need the site to contain a directory of those working within the field. Each of the primary users brings a different need to the table, which is addressed in these personas.
Heuristic Analysis: what the site looked like before and why we had to change it.
The site was difficult to navigate as it originated. There were huge blocks of text and it was unclear which steps would take you to the scholarly article portion of the site, which is the highest priority of users coming to the site.
You would have to go into a completed unrelated area of the site in order to sign in and then go to a separate area from that in order to read the articles, which you can only download if you download every article in that section. Which could mean downloading 11 articles in order to get the information needed from 1. Using Heuristic Analysis we found the problem areas within the site in order to address and alter them for the redesign.
Description of Insights gained from C&C Analysis
From our various C&C Analysis we found that SlaveFreeToday differed from other scholarly journal sites in these main ways:
Search filtration wasn’t utilizing the scholarly articles, but instead unrelated media on the site. Differing from other sites.
Downloadability: Other sites allowed you the ability to download as an HTML or Pdf
Share Function: Other sites allow for sharing the articles
Information Architecture: We as a group spent 2 hours discussing in detail each of the various functions of the site in order to finalize a specific structure for the redesign.
We whiteboarded the ideas out and went through each considering the needs of the 4 User Personas and came to an agreement on a more functional site structure.
One that prioritized the scholarly articles and also included the directory.
Explanation of the Jounry Map in bullet form
Jalisa North opens SlaveFree Today
She can’t find the Journal of Modern Slavery
She attempts to use the sitewide search function to find an article on ‘Sex Trafficking in East Asia’
The search results aren’t giving her the article
She finds the Journal, but has to download all 15 articles in order to get the 1 she needs for her assignment
She leaves the site and goes on Google Scholar instead
The wireframing process was full of learning. We’d all had very little experience using the program Figma, but came together to create 120+ functional wireframes of the mobile and desktop versions of the SlaveFree Today website.
Mobile functionalities like the hamburger found at the upper left and the prompts to sign in and donate were changed with the Hi-Fi wireframes.
These are the some of the lo-fi wireframes here.
Usability Testing and changes made:
Changed the hamburger menu button placement and search bar
Changed the Search function and added filters
Changed the NGOs to Organization and added filters in that search
Added an option to change calendar view to list view
Made the Call to Action button for sign up clearer and more prominent
Added icons to make the page more visually appealing
when deciding the mood board and brand guidelines we utilized what was discussed with the stakeholder during interviews:
“Not to use college colors or colors that would indicate a specific country allegiance”
Keeping these ideas in mind we went with a global color scheme, the colors of the planet, and we focused on typography that would be easy to read on a mobile device. Roboto Bold, Open Sans Light.