Origins

AFRONET originated as a dissertation project that I completed during my time at Salford University. Initially, I created the website design using LinkedIn tutorials as a guide, although I had limited experience with AdobeXD. Despite the project's strong concept and my high overall dissertation grade, I recognized that my design skills and knowledge were insufficient, resulting in weak hierarchy and poor alignment.


Subsequently, I dedicated myself to daily studying of User Experience (UX) principles, working through Google's UX course, and refining my design skills. A year later, I was tasked with developing a Mobile and Web Application for social good. I decided to revisit AFRONET and completely rework the design, including a new mobile application. On this page, you can view both the old and new AFRONET designs. I trust that you will appreciate my updated approach.

At-A-Glance

AfroNet is a social networking app for Manchester's Black diaspora that will allow the community to connect through entrepreneurship prompting jobs and educational meets to allow black counterparts to connect and promote economic growth within the community.

Problem

The Black community spends 95% of its money outside of its community to only receive 5% back with 3% going to non-black-owned businesses leaving the community with only 2% (Black owned Manchester. 2020, June 21). Along with this Black-owned businesses actively contribute 25bn-32bn to the British economy each year but statistics show that black entrepreneurs are twice as likely to be denied a loan when compared to their white counterparts (New, N. W. 2020, August 6).

Solution

To create AFRONET a subscription-based website that would allow the Black community of Manchester to come together and educate, share job opportunities and start new businesses. Which will ultimately allow economic growth within the black community but also Manchester’s community. 


The initial logo was designed using plain text and a silhouette of an afro hairstyle. However, I found the features within the logo gave it a masculine vibe. To make the logo more inclusive and representative of all Black people, I removed the facial and neck features from the silhouette, resulting in a more anonymous representation. This change was necessary to ensure that the website didn't give the impression that it was solely intended for men.


I then decided to use the Globe with Africa front and centre, I did this to pay homage to users' origins.


The gold colour was chosen to represent the premium aspect of subscription and to convey the wealth and natural resources in Africa.


Globe also alludes to the African diaspora.

Original screens

Home page

Sign in / recover password

Create account

Subscription

Profile page

AFRONET Mobile Sketches

􀊰

􀆪

return

space

123

􀆛

􀆞

M

N

B

V

C

X

Z

L

K

J

H

G

F

D

S

A

P

O

I

U

Y

T

R

E

W

Q

Create a post

Segun Abiodun

Post

Adewale

9:41

Mobile Mock- ups

Made by Shaqkeal Abiodun

2023

Takeaway

Upon revisiting AFRONET after a year of studying UX design, I was struck by how much I had learned and grown as a designer. The experience of analysing my own design work and identifying areas for improvement was incredibly rewarding. It allowed me to see how far I had come and how much more I was capable of achieving.


One of the most valuable lessons I learned during my studies was the importance of user-centered design. By focusing on the needs and experiences of users, I was able to create designs that were more intuitive, efficient, and enjoyable. This approach allowed me to better empathise with users and create designs that truly met their needs.


In addition, the skills and knowledge I gained during my UX design studies helped me to better understand and appreciate the complexities of the design process. From conducting user research to creating wireframes and prototypes, I gained a deeper understanding of how to create designs that were both visually appealing and functional.


Overall, revisiting AFRONET was a great reminder of the progress I had made and the skills I had acquired during my UX design studies. It was a humbling experience that reinforced my passion for design and my commitment to continue growing as a designer.

New Desktop displays

AFRONET

Mobile app & Web design

My Roles: Lead UX designer & researcher

Application: Figma

Duration: March 2023 - April 2023

Created with: Google UX course


Logo

Original




New

Landing page

OLD

  • No text hierarchy

  • No icon alignment

  • Same font weight

  • “Join now” not a clear action button to the user

  • Poor image choice

  • No universal icons

NEW

  • Text hierarchy

  • Clear actions for the user ( sign-up or Login)

  • Spacing between text

  • Clear concise message

  • Removed icons for less clutter

Profile page

OLD


  • Poor alignment

  • Missing text

  • No proper spacing / Hierarchy

  • Doesn't display Afro Premium benefits

  • Lack user information

NEW


  • Better spacing

  • Correct alignment and text weight

  • More info about the user career

  • Universal icons used

  • Easy to navigate

Subscription page

OLD

  • Unnecessary use of icons

  • Poor use of buttons

  • Doesn’t specify benefits

  • “Continue” button too big not the action we want the user to take.

  • Visual clutter a lot for users to digest

  • No alignment or spacing used

  • No hierarchy of text

NEW

  • Visually digestible

  • Alignment and spacing used

  • Changes of font weight (add emphasis)

  • Gold shadow to capture user attention (Attractive plan)

  • “Skip for now” in small text (doesn't draw initial attention)