Contains my design work, process and rationals.

1. PORTFOLIO
Adams Abdulmajid
UI/UX Designer

2. ABOUT ME
I am a ui/ux designer with the ambition to change the
world by creating solutions that makes the most difficult
things easy.Impacting peoples lives everyday is a feeling
that is second to none.
You have not lived until you have done something for someone"
“We are what we repeatedly do. Excellence, then, is not an act,
but a habit
- Aristotle

3. THINGS I DO
Survey &
Interview
Persona
Creation
Wireframing
Sketching Prototyping
Web & mobile
Design
Storyboarding
Information
Architecture
User research
& Analysis
Agile
Methodology

4. PROJECTS

5. 01
MY SWEET HOME
DESCRIPTION
ROLE
PROBLEM
mysweethome is a real estate mobile app that allows users to buy, rent and sell properties.
I design the mobile app, did the user research, testing, wireframing and final design
A lot of people travel each for different reasons and about 70% of these them are travelling
to a country or city they haven't been to
before, therefore they need a safe, nice and reliable place to stay.
This is where mysweethome comes in, to provide people with such needs.
DELIVERABLES
Wireframe for customer feedback
High fidelity prototype
UI assets for developers

6. MY SWEET HOME
PROCESS
I conducted interviews with alot of people that i believe to be potential users about 70% of them where tourist, worker etc and about 30%
were real estate agents, I ask them several questions to capture their motivations, beliefs, goals, behaviours and their demographic
information
This research was also used to guage the viability of the product in the market by researching about similar successful products ad also
identifying ways in which the value of the product could be increased.

7. PERSONA SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
After the research i came up with two primary personas, one
representing a tourist and the other represent a real estate agent

8. PERSONA SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
...then i moved on to sketching where i had about 2-4 options for
each screen

9. PERSONA SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
...after the sketches are done i started designing a low-fidelity wireframes
which were tested with potential users to get feedback and also to make sure the user needs are being stisfied

10. PERSONA SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc

11. DESIGN DECISION RATIONALE
Navigation Used to provide a clear visual indication of what content can befound on the product
and places the current location in context by highlighting it.
Carousel It optimizes screen space by displaying only a subset of images from a collection of
images in a cyclic view. The carousel suggests additional content that is not currently
visible, this encourages the user to continue exploring.
Cards Browsing is a large part of interaction, and users want to be able to quickly scan large
portions of content and decide if they want to see more.
Favourite
Accordion
Search filter
Assigning favorite status is a quick way of allowing users to select preferred content from
regular content.
This is used to reduce the cluter on a page so they do not get overwhelmed by the amount
of content on a page
This encourage users to potentially remove what they dont need by giving them several
search options

12. 02
KNOWLEDGE X
DESCRIPTION
ROLE
PROBLEM
KnowledgeX is an intelligent personal assistant mobile app, Students used this app
to review the materials they studied at school and can alsoask it any question to
increase their knowledge base.
ui & ux
Its been known students of all age group learn and understand things in different
ways and at different pace, and to solve this a solution where by students could access
their school materials anytime and anywhere was introduced.
DELIVERABLES
Branding & Mascot design
User journey diagram
High fidelity prototype
UI assets for developers

13. PERSONA SKETCH
HIGH
WIREFRAME
The persona was created to serve as a fictional character used to represent groups of potential users for the product.
This helped me to fully understand the user needs, experience, goals and motivations
so as to design a better product that is tailored to the specific user needs.
LOW
WIREFRAME

14. KNOWLEDGE X
FEATURES
PAIN POINTS
Students would be able to log in using their school credentials
It offers the same subjects
Students could chat with it both with voice as well as text.
It has a pronunciation validator to correct the user incase of any grammatical error.
A leaderboard and achievement system to compete with friends and stay motivated.
Students are not giving the opportunity to learn at their own pace
Different people understand things in different ways
The traditional way of learning doesn't fit everyone

15. KNOWLEDGE X
APP FLOW

16. FLOW SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
I started created series of sketches just to lay down all my ideas for the product,
these allowed me to know what design style to follow.

17. SKETCH
HIGH
WIREFRAME
LOW
WIREFRAME
FLOW

18. PERSONA SKETCH
HIGH
WIREFRAME
LOW
WIREFRAME

19. PERSONA SKETCH
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc
LOW
WIREFRAME

20. PERSONA SKETCH
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc
LOW
WIREFRAME

21. Cards
Search filter
DESIGN DECISION RATIONALE
Navigation Used to provide a clear visual indication of what content can befound on the product
and places the current location in context by highlighting it.
Carousel It optimizes screen space by displaying only a subset of images from a collection of
images in a cyclic view. The carousel suggests additional content that is not currently
visible, this encourages the user to continue exploring.
Browsing is a large part of interaction, and users want to be able to quickly scan large
portions of content and decide if they want to see more.
This encourage users to potentially remove what they dont need by giving them several
search options

22. 03
CRYPTOLITE
DESCRIPTION
ROLE
OBJECTIVES
Cryptolite is a crypto currency mobile app that provide a simplified and centralized
exchange,and also makes it easy for non-professional traders to understand, follow
and also be able to trade numerous type of cryptocurrencies.
ui & ux
Make a clean, intuitive user interface for non-professional traders to understand.
Provide a platform where traders can buy, sell, exchange and also send coins into
their wallet with top security
DELIVERABLES
Wireframes
High fidelity prototype
UI assets for developers

23. PERSONA SKETCH
HIGH
WIREFRAME
The persona was created to serve as a fictional character used to represent groups of potential users for the product.
This helped me to fully understand the user needs, experience, goals and motivations
so as to design a better product that is tailored to the specific user needs.
LOW
WIREFRAME

24. CRYPTOLITE
APP FLOW

25. CRYPTOLITE
COMPETITIVE
ANALYSIS

26. FLOW SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
I started created series of sketches just to lay down all my ideas for the product,
these allowed me to know what design style to follow.

27. SKETCH
HIGH
WIREFRAME
LOW
WIREFRAME
FLOW

28. PERSONA SKETCH
HIGH
WIREFRAME
LOW
WIREFRAME

29. PERSONA SKETCH
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc
LOW
WIREFRAME

30. PERSONA SKETCH
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc
LOW
WIREFRAME

31. PERSONA SKETCH
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc
LOW
WIREFRAME

32. PERSONA SKETCH
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc
LOW
WIREFRAME

33. Cards
Search filter
DESIGN DECISION RATIONALE
Navigation Used to provide a clear visual indication of what content can befound on the product
and places the current location in context by highlighting it.
Carousel It optimizes screen space by displaying only a subset of images from a collection of
images in a cyclic view. The carousel suggests additional content that is not currently
visible, this encourages the user to continue exploring.
Browsing is a large part of interaction, and users want to be able to quickly scan large
portions of content and decide if they want to see more.
This encourage users to potentially remove what they dont need by giving them several
search options

34. 04
TRIM BANKING APP
DESCRIPTION
ROLE
PAIN POINTS
Trim is a mobile banking application that offers great banking services to customers
on the go. Banking has never been so much easy, users can make all necessary
transactions such as money transfers, utility bills, online payment etc.
ui & ux
Most banks are inefficient and this leads to decrease in user experience
Security breach has always been an issue when it comes to Digitalization.
Customers all these concern that most of their banks doesn't show enough
transparency which eventually leads to lack of trust.
Customer wants to feel that their needs are being met, so creating a personalized
feature goes a long way in keeping user happy.
DELIVERABLES
High & Low fidelity prototype
UI assets for developers

35. TRIM BANKING APP
APP FLOW

36. PERSONA SKETCH
HIGH
WIREFRAME
The persona was created to serve as a fictional character used to represent groups of potential users for the product.
This helped me to fully understand the user needs, experience, goals and motivations
so as to design a better product that is tailored to the specific user needs.
LOW
WIREFRAME
Williams Smith
GOALS
Williams is an investor with lot of properties and share in several
business. Love meeting people, driving luxurious cars.
He loves getting involve by investing in new technology.
Pain points
63 years old
Save enough money
Competing with friends
To be more active
Poor customer experience and lack of choice
Lack of personalization
Absence of Instant Checkout Experiences
Information overload for users
Lack of enough transparency
Investor
London
"To become the best pilot
in the world you need to
study the hardest."

37. FLOW SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
I started created series of sketches just to lay down all my ideas for the product,
these allowed me to know what design style to follow.

38. SKETCH
HIGH
WIREFRAME
LOW
WIREFRAME
FLOW

39. PERSONA SKETCH
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc
LOW
WIREFRAME

40. PERSONA SKETCH
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc
LOW
WIREFRAME

41. DESIGN DECISION RATIONALE
Used to provide a clear visual indication of what content can be found on the product
and places the current location in context by highlighting it.
It optimizes screen space by displaying only a subset of images from a collection of
images in a cyclic view. The carousel suggests additional content that is not currently
visible, this encourages the user to continue exploring.
Browsing is a large part of interaction, and users want to be able to quickly scan large
portions of content and decide if they want to see more.
This encourage users to potentially remove what they dont need by giving them several
search options
A Walkthrough of your product or service helps inform users about:
What your product can do
If your product is what they’ve been looking for
If your product will help users accomplish their tasks
Whether or not they should join your service or pay for your product
Navigation
Carousel
Cards
Search filter
Onbaording

42. 05
PRIVILEE
DESCRIPTION
ROLE
Privilee is a mobile app that gives exclusives access to the UAE best beach club and top
luxury resorts and their lush pools, beaches and gym
UI/UX design, research, testing
DELIVERABLES
Wireframe for customer feedback
High fidelity prototype
UI assets for developers
HOW IT WORKS
You register your with the required information and after 3 days you receive your privilee card
This card gives you free access to beach clubs, pools, gyms, spa facilities and tennis and squash
courts at our partner hotels, seven days a week, all year round.

43. PRIVILEE
PROCESS
I started by researching, i did user research as well as third party research by using google and other form of social media. I was able to
identify user needs and well as their goals, motivations and behaviours.
I started analysing the user data by identifying the behavioural variables and these was later used to create the persona, and after the
users pain points was known i sketched down my ideas for possible solutions to the problems.
Using design guidelines and ui patterns i was able to chose the most suitbale design solutions which was later transfered into wireframes
for user testing, the feedback i got was the testing was incoporated into the final design.

44. PERSONA SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
After the research i came up with one primary persona that represent
a typical user of the product

45. PERSONA SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
...then i moved on to sketching my ideas

46. PERSONA SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
...then i moved on to creating the wireframes

47. PERSONA SKETCH
LOW
WIREFRAME
HIGH
WIREFRAME
...then finally the high fidelity wireframes that shows my design decisions, colors, typography etc

48. DESIGN DECISION RATIONALE
Navigation Used to provide a clear visual indication of what content can befound on the product
and places the current location in context by highlighting it.
Cards Browsing is a large part of interaction, and users want to be able to quickly scan large
portions of content and decide if they want to see more.
Accordion
Search filter
This is used to reduce the cluter on a page so they do not get overwhelmed by the amount
of content on a page
This encourage users to potentially remove what they dont need by giving them several
search options

49. THANK YOU
YOU CAN REACH ME ON
Behance.net/a_majid
LinkedIn.com
adamsmojeed10@gmail.com