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