top of page
ReImagineYou_frontcover.png

Re-Imagine You

Designing the Order and Fulfillment system

Overview

Re-Imagine You focuses on providing support to disadvantaged underprivileged people of color through mentorship, goal-setting, and educational advancement.  Re-Imagine You is based in Atlanta GA, and they are committed to supporting teen parents, students, and working adults. They're a new nonprofit in need of a responsive, well designed website that will be informative and help their audience reach out to get the support they need.

Goal

Create a responsive and informative website that users can easily navigate. 

Role

UX Design, User Research, Information Architecture, Interaction Design and UI Design

c029bfc8-c3a9-4f1a-90c3-c60d42423850_rw_1200.jpg

02

Research

We had an initial meeting with the nonprofit and asked questions to understand their wants and needs, and also to learn about their mission and their goals. We also created a problem statement, to help us stay on track and established a primary and secondary audience. We also refined our goals and acknowledged potential challenges. For example, lack of research on or primary audience and the potential disadvantages from that. 

03

Inspiration 

Our client was still gathering content at this point, so we went ahead and did our own research to find out what other similar nonprofits are doing with their websites. These are some of the websites that inspired the content that we proposed to the client for our next meeting.

454b14cc-fa92-4fec-b86d-3d34d54182ac_rw_1920.png
23bae0f4-6b49-4527-a06b-173222f0e770_rw_1920.png

04

Planning the IA

After observing and researching similar nonprofit websites and their content, we created a sitemap for the client that included features and functions that most nonprofits include in their websites, after discussing content with the client, we refined the sitemap, according to the Re-Imagine You’s current needs. The non-profit is new and benefits best from a smaller site with less features for the time being.

05

Exploring Design Solutions

Sketches were made during the brainstorming and research phase of the project, these sketches were a crucial first step that helped shape the wireframing process. We sketched a lot of different arrangements of the layout design and reorganized the website pages and their content before choosing this sketch as the foundation for our design.

67668b00-aa0b-4392-8434-69147ffdbecb_rw_1920.jpg
5df99849-116f-4241-aecf-05fa9f960afe_rw_1920.jpg
9d898b94-7db3-4a74-a29e-2c9188953ed6_rw_1920.jpg

06

Wireframes

We created a mid-fidelity wireframe that included finalized content and images. We wanted the client to get a feel of what the final site would potentially look like and get feedback before moving forward with usability testing. We decided that the final design would only include a home page, about us page, contact page and donation page.

07

Validation

For our first round of usability testing we observed 3 participants as they navigated through the prototype. In this gif, you can observe how one of our participants quickly clicked around the website and hardly read much of the information.

The feedback from our participants encouraged us to expand our sitemap, and reorganize the final website to better guide users. We added a services page and a who we are page, to make the content easier to digest and navigate.
 

Our other high-level takeaways from the usability testing included
1. Update website copy to align with the users’ needs. 
2. Provide more information about how to join and details about what the
     program consists of, timing, etc.
3. Use social media to reinforce the branding and services Re-Imagine You provides.

e43d8a3f-4af7-4d60-8e9b-babc5680ea4c_rw_600.gif
b1f284af-2c5a-4c2d-80d7-c3013967f0dd_rw_1920.jpg

08

Brand Design

For the style guide, in addition to defining the colors and typography, we created assets like icons and shapes that we use throughout the site consistently,  we also created a logo to keep the brand consistent. The clients audience primarily consists of younger folk, as such we created abstract shapes and used a more vibrant color palette to encourage positive engagement. 

09

Reception & Next Steps

Re-Imagine you’s board of directors has approved the website and has requested further usability testing to help refine the website's usability and content. We look forward to continuing our work on the website by facilitating for users so they may get the help and information they deserve.

Screen Shot 2022-09-20 at 2.42.37 PM.png
bottom of page