IHDRF - FIFILO - A UI UX Design Studio

Donation made easier through IHDRF

  • IHDRF
  • UAE
  • Non-profit
  • UI/UX Design

Humanitarian donations are made easier through design.

CLIENT

IHDRF

BUSINESS TYPE

Non-profit

SCREENS

30+

TIMELINE

1 Month

The Challenge

IHRDF App being a donations app, meaning using this app people could make donations towards the fund. However, in the existing app making donations required to go through many steps than was required. So because of this people were put off or reluctant to make donations. So the challenge was to make donations possible using the app with a very limited number of steps involved.

WireFrame

The Solution

Discover - To start off we carried out extensive research on other such payment applications like GooglePay, PayTM, Apple Pay and payment apps for banks and so on. Comparing the existing IHRDF App to these other payment apps was extremely enlightening. As a UX/UI enterprise this was a learning curve for us as well. So we looked at the best feature in each of these apps that could be incorporated in the IHRDF App to revamp the UI for a more engaging UX and at same time provide the payment solution for the app as well.

Define - The UI of the app had to be neat and minimal with simplified steps towards making donations. Different ideas and concepts were thrown around, some good and some not worth mentioning. The UI design had to reflect the humanitarian side of the app which would encourage people to make donations with a minimum number of donation steps.

Design - The design had to include options for card payments and Google Pay and Apple Pay enabled payment options. So focusing on the main challenge we created a user flow chart that reflected the number step a user had to go through to be able to make a successful donation in the existing app.
The challenge here was to eliminate the unnecessary steps required to make the donation without compromising the core functionality of the app. Trying out different UI designs we were able to come up with a viable solution. Then we proceeded with designing the wireframe to get a better perspective of the design. Then we followed it up with the system design to achieve consistency of the UI components with the respective designs. Following the completion of all the UI components we started with the designing of the interface. Then finally we were able to create a prototype to represent the user interface and the donation steps like a finished product.

Deliver - In this stage we did the final evaluation and inspection of the product before testing. This being our first project for a payment and donation app our team was very excited to find out if our creation worked for real or not. And walla! It worked exceptionally at that. So in the end we were able to deliver the final product in the present form of IHRDF App that makes it possible for people to make donations to the relief fund in 3 short, simple and easy steps. The redesigning of the app added another quotient of UX and aesthetic appeal to the IHRDF App.

The Typeface

Montserrat

The old posters and signs in the traditional Montserrat neighborhood of Buenos Aires inspired Julieta Ulanovsky to design this typeface and rescue the beauty of urban typography

Montserrat Bold

Aa

1234567890

ABVDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz

Montserrat Regular

Aa

1234567890

ABVDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz

Color Palette

Primary Colors

HEX

RGB

CMYK

#208399

32, 131, 153

191, 79, 60, %100

Secondary Colors

HEX

RGB

CMYK

#F99137

249, 145, 55

0%, 42%, 78%, 2%


Other Secondary Colors

HEX

RGB

CMYK

#F99137

249, 145, 55

0%, 42%, 78%, 2%

HEX

RGB

CMYK

#002436

0, 36, 54

100%, 33%, 0%, 79%

HEX

RGB

CMYK

#FF0000

255, 0, 0

0%, 100%, 100%, 0%

HEX

RGB

CMYK

#F2F2F2

242, 242, 242

0%, 0%, 0%, 5%

Have A Design Idea

Let's create a better user experience
together!

icon
icon icon icon icon icon icon