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)