Yoga's UI/UX Portfolio

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Hi there, here is

Yoga’s

UI/ UX Portfolio.

Selected Project 2020 of Aries Fadli Prayoga SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Aries Fadli Prayoga UI UX Enthusiast, Architecture Graduate

Skill

About Me

UX Research

Interaction Design

Information Archiecture

Usability Testing

Design System

Graphic Design

Prototyping Design Design Sprint

Digital Painting Project Management

Wireframe

A creative, detail-oriented, and data-driven Architecture Graduate who loves solving problem trough design, with proven skills in design.

Experienced working in Architecture firm about a year until now, able to work with a tight deadline and under pressure.

Software Tools Prototyping

Education

Figma

UI/UX

XD

Sketch

Design Graphic

Purwadhika Job Connector Program 2020 - 2021

Project Management

Digital Marketing

Purwadhika Part-time Program 2020

Operating System

Bachelor Of Architecture Bandung Institute of Technology 2015 - 2019 UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Curiculum Vitae Working Experience 2020

Arkonin Architects

2019

Anggara Architeam

2018

Junior Architect Support handling on 2 on schematic phase project : Museum Rosullullah at Ancol, Indonesia and Creating a feasibility studies for LRT Jakarta

Junior Architect Sept - Dec . Involved in 2 project as PIC and 5 others as Support

Organizational Experience

LABO. Architecture + Design Asistant Architect May - August . Involved in 5 project

Dirjen Sumber Daya Air Pusat Bendungan

Ilustrator Project name : Pedoman perencanaan pembangunan embung kecil dan bangunan tampungan air lainnya di desa.

Chief Executive of Gaung Bandung 2018

2018

Head of Media & Publication

2017

GAUNG BANDUNG 2018, “Menghempas Batas Ruang Kota Kita” Annual Bandung Scale Event

STEMA ITB, Theater interest based organisation on ITB

Head of Rhone

2017

FACADE 2017, Annual Architecture excurtion event of Architecture ITB

Techfest 2017

Best Staff Graphic Design

Media Publication Designer Bandung scale Event, Held by TEC ITB

WISOKTO 2015, Annual event of KM ITB

2015

Contact +62 851 564 84 342 Komp. DPR Jl.Jalak III blok A4 no.5, Bintaro, Jakarta, Indonesia work.yogaaries@gmail.com linkedin.com/in/yogaaries/ medium.com/@yogaaries9911 dribbble.com/YogaAries9911 behance.net/yogaaries9911 instagram.com/yogaaries/

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

CONTENT

ON : TI : ME - Time Management App UI/UX Case Study

Switching OVO from paymet gateways to a lifestyle companion - UI/UX Case Study

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Graphic design - Digital Painting, Merchandise, Book Layouting, etc

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Logo Project - Kun. Tum.Buh, LN Point, Tamasya Travel

Strava Redesign Coming soon

SELECTED WORKS 2015 - 2021

Future Project With your company :)

SELECTED WORKS 2015 - 2021

ON : TI : ME Life-Management App | UI/UX Case Study Facing a distractive and LOUD era!

The presence of the internet is exposing more stimuli, everything forcing us to attract our attention, if we can’t manage our attention, then we just swinging around and we can’t reach our goal.

Also, this pandemic condition, which forces us to stay in our homes, makes us exposed to information stimuli more frequent because there are no ques for our bodies to understand the time to work, rest, play, everything is merging into one day. This makes us feel tired and leads to depression. This situation makes me feel my life is so messy and cluttered all over the place.

This is very personal problem of mine wich so i tried to make a product that solve ths problem. I need a tool to manage My attention and focus on finishing things one by one.

Problem Hypothesis I needs to have a Time-Management tools because of the cluttered perception of time.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Role UI & UX Designer Duration 1 Month Tools FIgma SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Problem Whats up with? | Exploratory Research

Story of my life From childhood, Yoga was always woken up by his mother every morning to take a bath, pray, and get ready for activities. However, since studying in college majoring in architecture, Yoga has lived alone in his boarding room. The “studio” culture makes him pull a lot of allnighters.

This made Yoga waking and sleeping hours a mess. After graduating from college, Yoga needs to have a more organized life, because he is currently working on 8–5 office.

Build app solutions that help people like Yoga!

User Behaviour Then, I tried to make some “How might we” solutions based on my daily routines activities.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Pain Points Based on My life story I pull some pain points from my current condition.

I picked some interesting ideas to develop SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Emphatize Are we getting there? | Evaluative Research

Current Solution Analysis Based on Nir Eyal Books “Hooked” if we want users to do an action we should consider 3 major things (Motivation, Ability, and Trigger).

So I analyzed my current solution based on this equation.

Behaviour

B=MAT Motivation

To do list Note

Ability Hard

Trigger None

Ability

Trigger

Alarm

Motivation High

Ability Easy

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Trigger High

Motivation Low

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Current State User Journey

To gather a more clear understanding of the “How Might We” point that I have, I mapped it out in the current state user journey.

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Ideation How to solve it? | Brainstorm

Main feature Ideation One day view clock

Un-Snoozable Alarm

“Go to sleep!”

“Here ur plan of the day” To plan our day we need to see how much time do we have in a day, so i created this 24 hour view clock.

“Wake Up!”

This alarm remove distraction when we are going to sleep and move our body to get up from the bed. To build a sleeping pattern

Pomodoro Focus Method

To stay focused at work, we could use pomodoro tecnique 25min working and 5 min resting.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Wireframing

After got the big idea of the product, I grab a notebook and start sketching some wireframe.

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Prototype Introduction Page

To make user understand our product I need to explain the product as clear as posible.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Prototype User Data Gathering Page

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

At first sign up, we neet to gather some user data to make this app personalized to secific user.

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Prototype App Main Flow

There is a Calendar and Report view to make user know their schedule more comprehensively.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Prototype Adding New event Flow

User can categorize their event based on their needs and while they are scheduling they can view the full picture of the ir schedule in calendar view.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Prototype Alarm Page

The sleeping alarm is guiding user to put their phone away while they are going to sleep and make user to get up and turn on the light to wakes up from the bed.

Scan Here to try the Prototype!

bit.ly/ONTIMEprototype UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Switching OVO from paymet gateways to a lifestyle companion UI/UX Case Study Every coin has two sides

Now we live in an easy era. All can be done through the small device that we hold every day. In the past few years, various business models have emerged that make it easier for us to get things done, such as online shopping, ride-hailing, food deliveries, online billing, etc. All of these services can be paid for without using physical money, we no longer need to accept change in the form of candy. Transactions are carried out seamlessly. Of course, this is very beneficial for the user, but in terms of business, users are encouraged to be more consumptive and users are increasingly confused about controlling their expenses.

Therefore, I made a case study to make OVO into a customizable digital wallet that benefits the user by providing a sense of control in spending money but still profitable business because it forms an investment loop that increases user retention.

Design Hypothesis User afraid to use OVO as a main wallet system because the friction to use ovo is too “loose” UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Scan Here to see the full case study!

Role UI & UX Designer Duration 2 Weeks Tools Figma SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Background Context Whats up with? | Exploratory Research

According to the data from the bank of Indonesia, in 2019 alone, there were 4.7 million cashless transactions and 128 trillion volume of cashless transactions in Indonesia. Supported by the COVID-19 pandemic, it is increasingly encouraging to reduce the use of paper money to avoid the movement of germs and viruses. Thus, a cashless society is the future of transactions.

What benefits do users get?

The growth of the digital money business, which is competing to attract new users, has made more brands of digital money circulating in Indonesia. The user gets a lot of benefits from this competition, Start-up burns rate model to gather more customers carried out to be very beneficial for the user with the emergence of various promos and cash backs. Technologically, the development is getting faster with more services provided, which of course makes it easier for users to pay for something.

Any bad side?

Through a study conducted

by Ipsos Indonesia**, the majority of Indonesian consumers use 2 or more types of digital wallets. The increasing number of available expenditure funnels makes us more difficult for us to track and plan our expenses every day.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Hypothesis

Users are no longer seeing digital money as new technology and are starting to realize the need to manage their digital spending. With so many types of digital money services, users feel financial anxiety about spending their digitals. If this situation continued, the only digital money that has better deals will survive, because in Indonesia there are a lot of digital money brands that have similar features.

Objective ”OVO needs to be more become a habit-forming product, by adding more user investment.”

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Empathize What and how? | Explanatory Research

User Profile The majority of users are 16–25 years old (generation z and millennial) and have their own income in the range of 5–10 million per month, of course, users are tech-savvy.

User Motivation User use digital money because they feel secure, enrich their lives, and digital money is definitely beneficial for the user. But as we can see users have low motivation to be loyal to a specific brand.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

User Pain Points

Users feel more consumptive, afraid to use digital money because financial anxiety arises. Users feel lacking a sense of financial control.

Curent Solution User have unique approach to control their expense is by 4 pillars: Budget limitation, budget documentation, budget planning, and adding friction into their prosses of spending.

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Empathize What and how? | Explanatory Research

Qualitative User Research

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

User Persona

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Empathize Are we getting there? | Evaluative Research

Market Positioning Based on recent studies from IPSOS Indonesia, OVO has the biggest brand share among other competitors.

Still, the biggest competitor for OVO is Gopay as seen on the similar web, and users tend to use triple or more brands on their phones.

Feature Comparison

Digital money in Indonesia tend to have the same business model and the same looks product-wise. If we look into feature comparisons, Jenius has the most feature to make users more aware of their expenses, it’s because there are differences in goals that the company wants to achieve, Jenius wants its users to save their money in their bank, and OVO wants to user spend as much as possible.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

History Page Comparison

OVO has the least feature for the history page, doesn’t even give an indication difference between expense and income transactions. Some interesting feature provided by paypal with their searchbar and filter tools, this such a powerful feature for user while looking to their history page.

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Define What things to be considerate? | Evaluative Research

Business, User, and Technology Consideration

I mapped the goals from every subject in the project to help me understand more about the project comprehensively. Defining overlaps goals between the subject, so I could focus all my time and effort on solving the most relevant goals.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Curent State User Journey

This current-state user journey aiming to see more clearly the area of improvement that can become a guideline in the ideation process.

How Might We? After brainstorms all the how might we point, I mapped it into a 2x2 matrix to prioritized all idea that has been gathered based on user and business needs.

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Design Terms Psychological Theory used in this study case

Investment Loop The investment is the string that pulls the user back. The aim is to get the user to return unprompted. To do this, the habit-forming company increases the value of the product with each pass through the Hook Model. Value is added to the system in stored value system.

Source : Nir Eyal Hook Model (https://www.nirandfar.com/ makeyourusersdothework/)

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Competence

Autonomy

Relatedness

Self Determination Theory

Self Determination Theory Based on recent psychology studies, users will develop a “reactance” if they feel that someone or something is taking away their choices or limiting the range of alternatives. As a digital product, ovo needs to apply Self-Determination Theory identifies a belief in user own freedom to choose as a key requirement for sustained motivation.

Source : Self determination Theory (https://en.wikipedia.org/wiki/Selfdetermination_theory)

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Ideation “Having a sense of financial control and report that reminds you to spend mindfully is the logical step for OVO to make the switch from payment gateways to a lifestyle companion.”

Future State User Journey

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

Asigning New Feature After getting the rough visualization of the feature flow.

I need to synchronize those features into the existing app.

To have a clear understanding of the OVO app, I create a simple conceptual model. So I could visualize how I put this new feature.

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Wireframe

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

#DompetKamu After did some messy brainstorming and contemplating, I came up with this customizable wallet idea, then name it #DompetKamu this feature enables the user to create their own wallet for their specific needs.

#DompetFleksi

There are 2 modes of wallets that users can choose from, namely the definitive wallet (#dompetpasti) and flexible wallet (#dompetfleksi).

Here is how it works:

#DompetPasti

1. User can customize the name for the wallet 2. User can set their budget expenses 3. Displayed cashflow information based on categories 4. Displayed cash flow based on the timeline

1. User can plan their definitive expense 2. User can see their internal wallet cashflow 3. Displayed unpaid and paid bills

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Prototype

Introduction Page

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Prototype Add New Wallet

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Prototype Activity Page

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Testing Usability Testing And User Interview Result This usability test was able to be carried out in one session with a total of 13 participants. This usability testing held with 2 scenarios, moderated and unmoderated. both held online due to the pandemic circumstances. I am testing 5 flow for this prototype, such as:

Generally speaking, user gets hows the feature works, and its easy to understand. But some screen needs to rework, there were a few findings wich then I captured into a map.

1. Feature Introduction 2. Add new dompet Fleksi 3. Add new dompet Pasti 4. Check Report and Pay 5. Add new Transaction into a category This testing give me the completion rate of every task to identify the struggle that user get while using this product.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Graphic Design Project Digital Painting, Merchandise, Book Layouting, etc

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Gaung Bandung 2018 Greatfully, I got the opportunity to become the chairman of the annual event of IMA-G, the Bandung Gaung 2018.

Each year, Gaung Bandung raises different issues according to the context of the year, but still refers to the main purpose of Gaung Bandung. The theme of Gaung Bandung 2018 is “Inclusion in Access”.

Here I have the opportunity to realize our idea to bring together the designer and the user. From this meeting I hope that dialogue and exchange of ideas between the two parties occur, because in the real world, it seems like the designer is only embodies the dream of the client and often forget who ultimately uses his work is the user.

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

The user, is a human who utilizes the work of architects. They come from various backgrounds, generally what the designer hears is the majority.

Here, Gaung Bandung provides a platform where the designer is able to hear what is needed by the user in order to realize the design results that can be utilized by various parties.

SELECTED WORKS 2015 - 2021

Scan Here ! to find out more about Gaung Bandung 2018

SELECTED WORKS 2015 - 2021

Kun.Tum.Buh Logo Project

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Tamasya.Travel Logo Project, Social Management Project

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Ln Point Logo Project

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA

SELECTED WORKS 2015 - 2021

SELECTED WORKS 2015 - 2021

Contact

Scan Here to read recent project!

+62 851 564 84 342 Komp. DPR Jl.Jalak III blok A4 no.5, Bintaro, Jakarta, Indonesia work.yogaaries@gmail.com linkedin.com/in/yogaaries/ medium.com/@yogaaries9911 dribbble.com/YogaAries9911 behance.net/yogaaries9911 https://yogaaries9911.medium.com

instagram.com/yogaaries/

UI / UX PORTFOLIO | ARIES FADLI PRAYOGA