![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/2f5bdc194261625.662699762d098.png)
About the Project
The Congo Tree is a youth development charity based in the Democratic Republic of Congo (DRC) and the UK. They equip young people in DRC with life and leadership skills, support them with mentoring and encourage them to get involved in their community.
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200_webp/c6e95a194261625.65f984bb722ff.png)
![](https://mir-s3-cdn-cf.behance.net/project_modules/1400/c39d9c194261625.65f984bb72e5d.jpg)
My Role
Working as part of a dynamic team alongside two other designers, we collaboratively engaged in every phase of the project, from initial research and analysis to planning, strategizing, and design execution. While my contributions spanned across the entirety of the project, my primary focus was on the development of the mobile version of the site, which previously did not exist.
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/aefc21194261625.66226dbccd40b.png)
User Persona
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/a81dfd194261625.662383a5d2148.jpg)
User Research
Usability Test
We conducted a series of usability tests on the existing The Congo Tree website to assess how well the user can navigate the and understand the content. We did so by testing four different tasks, testing.
We conducted a series of usability tests on the existing The Congo Tree website to assess how well the user can navigate the and understand the content. We did so by testing four different tasks, testing.
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/945a16194261625.66228534ae536.png)
Based on the results of user testing, we analyzed users' insights and compiled an affinity diagram.
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/4ad6b2194261625.6622f226885ee.jpg)
I Like, I Wish, What if
We carried out dot voting among the three of us to assess which features we preferred.
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/5caf4b194261625.662389129b9cb.jpg)
Feature Prioritisation Matrix
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/974ad9194261625.66238b675649b.jpg)
Problem Statement
In this project, our focus was on redesigning their existing website to enhance the information architecture, navigation, and ensure the site's responsiveness on mobile devices. Our primary goal was to increase user engagement and enable the nonprofit to share its values and objectives more effectively with a broader audience.
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/67f357194261625.6622549deea8f.png)
User Journey Map
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/e12306194261625.662622c4572b0.jpg)
Competitor analysis
![](https://mir-s3-cdn-cf.behance.net/project_modules/1400/8b0a46194261625.6624f1705cc2b.png)
Existing sitemap
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/fa1400194261625.66255f015d300.png)
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/f4a7ee194261625.66255f015da7c.png)
New User Flow
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/488858194261625.66255f03eeceb.png)
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/a4eff2194261625.66262247604a7.jpg)
UI Audit
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/625929194261625.6626324f8aca0.png)
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/f7509d194261625.6626324f8a87a.png)
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/0692cf194261625.6626324f8b6e6.png)
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/e66f5b194261625.6626324f8b310.png)
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/b67ff4194261625.6626325049bf7.png)
![](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/316436194261625.662632504a0df.png)
UI Style Guide
We tackled a challenge at the organization where brand guidelines were absent, leading to inconsistency in the website's style. We created a comprehensive UI brand guide, introducing decorative elements and optimizing font selection for improved readability.
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/fb13fe194261625.662636249553f.png)
UI Design
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/4c5bd6194261625.662644597c4fb.png)
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/9570c7194261625.66265a11806c3.png)
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/68336c194261625.6626900ab5b6a.png)
![website redesign UI/UX non-profit organization mobile design redesign Website user experience Web Design ux user interface](https://mir-s3-cdn-cf.behance.net/project_modules/1400/ef0af7194261625.6626980b050c4.png)