Money transfers internationally have been redesigned

Desktop Design for the Website

Year 2021

Role Product Designer

Duration 2 weeks

My goal is to understand what people need and deliver highly innovative designs and a user experience that meets your business goals. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

Ria Money Transfer is a subsidiary of Euronet Worldwide, Inc., which specializes in money remittances. Ria initiates transfers through a network of agents and company-owned stores located throughout North America, Latin America, Europe, Asia-Pacific, Africa, and online. Ria is one of the big four remittance companies.
Detailed image of a section used for the website
Person using a MacBook and looking at the Ria website

Introduction and context

Since they began rolling out updated products, their website has not been changed. I was entrusted as an expert to create a site with a slick, contemporary feel that shows the different types of products they offer. Additionally, the company intended to focus on the US market at that time, and the site had to match the level of competitors in terms of the visual concept. The research, visual design and user experience were my responsibility.
Bunch of designs together that create another collection of my work

Analysis & Research

The project began with an analysis phase. In this phase, I conducted a digital workshop with the stakeholders. This was in order to identify the most relevant products and determine how to place them with the most impact for the business. In addition, we focused on demonstrating Ria's ambition and improving customer satisfaction in order to convince people to use our product and send money.

Next on my list was to study the major players in the market. I wanted to figure out what they are doing and what I can learn from them. This will enable me to come up with my own innovative idea geared towards attracting more customers.
Image from a online Meeting
Illustration used for Ria

New design language

The stackholders wanted a clean, easy to use and modern feel to their redesigned website. As part of the product team's effort, a library of UI components has already been built. By using this library, web elements such as buttons, color combinations, typography, and components will always be consistently arranged, organized, and freely accessible. Furthermore, I added some changes to provide a foundation for envolving and growing their digital brand in the future. After a few iterations, I was pretty happy with the outcome and had a lot of resources and guidelines at my disposal.
Figma with the Ria Design System

About the fold (Hero)

Following the successful completion of preparation, it was time to move on to the hero section. Based on the insights I gained from the analysis phase, I concluded that this is where the "Send Money" product should be placed, as most users conduct their transactions above the fold. To ensure that every customer receives the result they expect, I had to dive deep into the different scenarios that users might encounter.

Upon completion of the first design, I concluded that the design was too monotonous and failed to grab the attention of the customer. As a result, I created an additional shadow behind the component, something I incorporated into their current style. In addition to providing guidance, it also kept users from getting distracted by other things. Since the majority of the business' revenue is derived from this, it is crucial for the business to do well here.

The component needed to stand out while being clear about how to send money without being overloaded with buttons and information. Due to this, I created two types of buttons, allowing the hierarchy to be made clear and the information to be easily scanned.
Collection of design I did for ria
Detail from the Calculator for Send Money
Ria Website on a iPhone

Rest of the page

Now it was time to decide what content to include on the rest of the website. Additionally, I wanted to think about the appearance of the final product since a unified product should emerge.

It was crucial to continue using the dropshadow as an element after it had been introduced for the hero section. In order to address this, I decided to visually separate products and other information, such as links or reviews. Products are highlighted with colored accents, while useful details are revealed through the dropshadow.

As soon as the initial concept was ready, it was presented to all stakeholders for direct feedback. Overall, the feedback was positive. I created guidelines that other teams could use to ensure everything looked consistent, which was very well received.

My final conclusion was that I needed to focus more on the mobile app content block after showing the design to users. In an ideal scenario, users would be able to see the most significant features of the app directly. To demonstrate how the app would look for the corresponding feature, I created a content block that is interactive.
Desktop Version of the Hero, Animation is going to be added in the future
Some emojis used on ria.com
Send Money Calculator
MacBook with the Ria Website open
Banner Design
All the Sections I did for Ria
Collection of website designs mobile and desktop

Conclusion

In retrospect, I'm very happy with the outcome considering the short and intense timeframe I had to work within. Additionally, the user research and testing of the design were great opportunities for me to learn new skills, primarily analytical. My design improvements were able to be implemented quickly because of this, which taught me the importance of assessing your product as soon as possible with the end-user.

To check out this project on your own, you'll need to be located in the United States. In addition, you can connect to a VPN to get an IP address from the US.
Check out the website