WHO

Primary target group: People with temporary or permanent physical disabilities

• They need tools or aids to compensate for their missing abilities and readjust their behaviors and routines
• Both sensory and movement aids after surgeries or accidents
• Everyday tools to simplify life
• Customized items for their individual purpose
Service animals

Secondary target group: All relatives, family members, medical personnel, care attendants, etc.

WHAT

• A mobile app that shows users the inventory of items to support their daily lives
• Especially elderly users AND users with visual or other impairments could use the app
• Very large font types and images are needed
• Voice control of the app must be implemented

WHEN

• Users would use this application situative once they need these aids

• There are no other special temporal or seasonal times than ‘during day time’

WHY

• Disabilities often come with a lot of costs that are barely covered by health insurances
• To counteract this overproduction of goods and reuse existing resources before being demolished, people with lower incomes should have the opportunity to rebuy them
• Especially elderly and disabled people are often tricked or pushed into purchasing goods or services they don’t fully comprehend, want or require for their needs. Hence, transparency is a major aspect when designing this app

Brand values

Transparency, competence and professionalism. We understand the market of health devices and services and see the abundance of production. Some monopolistic structures could be broken through with the idea of reusing components.

Personality

In a hectic world of constant movement, Helping Hand is not only a consultant and facilitator – We have an open ear as well and listen thoroughly to our users and their needs.

Mission

To counteract the overproduction of health-related goods, reuse existing resources and help people with lower income to purchase items they need.

Base foundations

Whenever you need a helping hand.

Strong coherence 1

Between logo and name:
“Helping hand”.

Simplicity

The heart is always associated with positive emotions and medical care.

EYE FOR THE DETAIL

The brown hand is bigger, stronger and edgier – Should represent the hand of a caregiver. The black hand is rounder and slimmer – Should represent the target group.

Unidentifiable

In times of confused societies around genderism, these two hands are neither male nor female nor have any gender to avoid any discussions.

STRONG COHERENCE 2

Between logo and business idea:
“Second-hand shop”.

Optical illusion

The hands in the heart are technically not there and adapt well to light backgrounds (Excluded selection).

Shape

The heart is softly rounded without hard edges.

Inclusion

Did you recognize, that the black hand has only three fingers? While the thumb might be hidden under the brown hand due to its perspective, this is an indication of a disability and handicap to foster inclusion.

Color theory

• All colors are monochromatic
• They have a serious and mature personality
• No funky or distracting signal colors
• Colors look great in combination – All color tests passed successfully

Vision yellows with age

‘Older eyes are less able to distinguish the difference between blues and greens. Avoid using a color palette that is predominately blue, green or another “cool” color. Warm colors like red and yellow are best!’ (Source)

• Simple icons, numbers are in extra large size, easy-to-understand data visualization

• Product images are clean and aesthetic with a white background

• Images should be shown in a realistic use case and as a problem solver

• NO complexity in data visualization needed

• NO reflections, shades or dark backgrounds

• NOT in unrealistic or heroic situations

Principles

• Sans Serif
• Strong contrast between background
• Good legibility starts with text size
• Letter Spacing should help straighten out the reading experience
+ 5% Kerning

‘Older adults and people with low vision have less difficulty processing typefaces like Arial or Helvetica. Without the serifs, it’s easier to recognize characters. The thing you’ll hear the most from older adults, though, is to make the type larger.’ (Source)

Same as always

I have a certain process in mind and only sketch the most distinct ideas. From originally 6 hand-drawn outlines I ended up with more than three times as much. All the other ideas “develop themselves” along the way.

Informational architecture

Low Wireframes are the start of every (good) project. I have my issues with pen and pencil because I don’t really like my analog outcomes. But for this project, it was very important to understand the informational architecture of a webshop for mobile devices and to follow the ‘less is more’ approach.

⬆ News feed is Home screen

After the register/login screen (left) a user should see a feed that adapts to the individual needs (right). The more information of the customer is known, the better additional services can be shaped for the medical conditions and product categories.

Multiple product views ⬇

You can see on the bottom two different search results (left and middle). I wanted to make sure, that users have the opportunity to select how many products they want to display horizontally at the same time.

Creating real shapes

Mobile screens are small and impaired eyes need help with cleaner and bigger shapes to be stronger perceived. Edgy shapes have a maximum radius of 12pt and all tapping elements should be bigger than usual and distant from each other.

Modeling architecture

Following the low wireframes, the mid wireframes give now a first impression on how to structure the final screens. The less text, the better. Images should be self-explaining and buttons easy to perceive and understand.

⬆ Never lose focus

To simplify information and avoid information overload, the screens only offer what is necessary. This might look minimalistic, but for overview pages, much space is the key. If the user taps on menus or interact with tap and hold, all other elements than the focus are blurred out (right screen).

Better legibility for reviews ⬇

Users are interested in what others review about products they need as well. The app should only include trusted reviews from verified customers. These reviews can be perceived in three different sizes to enlarge both into text and image.

A smooth match

Both texts and images are adapted to the target group’s interests. They should be easy to read and impossible to misunderstand. The selected colors might calm the eyes and do not stress out a user during the interactions.

Design architecture

Now with the combination of the selected colors and the bigger elements to tap, a user can barely get lost within the application. The app bar on top of each screen appears after the registration/login and helps users to always understand where they currently are.

⬆ Mildly hues, artistic photos

This app wants to give an artistic glimpse of the products and services it offers. In contrast to many smiling and happy consumers in dubious brochures, photos should only indicate a product category and be either darkened or brightened to emphasize the text. Product photos should demonstrate a professional feeling.

Always give users the option to decide ⬇

Users should be able to always enter a product after searching for it. The button ‘put in cart’ will only be available on the product level. A helpful button for accessibility assists if users need additional help on this page to read out loud or zoom texts for better legibility.

• 1920*1080px
• More white space, three columns
• Two fixed bars to facilitate website access
  • 1st level: Contact information, shopping cart, language settings and user menu
  • 2nd level: Main product categories
• Two verticle widgets on the sides which follow scrolling
  • Left: Accessibility (a sub-menu with extensive functions to support impaired users)
  • Right: Help Finder (a clickable survey to make users help with the right filters to know what they need)

• Android large (360*800px)
• Works best on your computer