UI/UX Portfolio - Yoseph Duna

Page 1

Yoseph Duna UI/UX Portfolio


Yoseph Duna Design and copy based creative who often inspired by human behavior and pain points, passionate about giving ideas and transforming them into a magnificent and useful product. Since 2018, I've worked as an architect, writer, and UI/UX Designer Atma Jaya University, Yogyakarta

linkedin.com/in/yosephduna

+62 838-668-779-94

yosephduna.medium.com

yosephduna@gmail.com


















My Bluebird UI/UX Revamp Role

Strategy / Concept / Design / Prototyping Time

5 days


bluebird group Bluebird is known by the public as a company that provides taxi services. This company is categorized as a legend company that has been around for a long time and is known by the people of Indonesia.

In fact, bluebird has many features and services that people rarely know about, including:

Taxi service

Industry

Limo & car rental

Logistic

Bus charter

Etc.

Sell used car

my bluebird app My Bluebird is an online taxi application that allows users to travel by taxi within and outside the city easily and practically

step and aims

Test

Define Emphatize

Ideate

Prototype

We’re determined the desired outcome of the project

Create something that will present My Bluebird App in the future, so that Bluebird can continue to exist as a leader in the Indonesian market

Make some improvements to My Bluebird App, according to the business owned by Bluebird group


user persona

For this project is a revamp project and the time we have to complete this project is very limited, so we only appoint 2 people who can represent the results of this research.

As a result of the customer interviews and prior research, two distinct personas were formed which help guide reasoning behind certain design choices. Their pains are quite different which is important to remember for every single design and/or decision made. Joseph can be characterised as a tech enthusiast Beside, Wati is a kind of people who wants easy and simple things.


user review

evaluation

Listed below are some user reviews as suggestions and criticisms about My Bluebird app that I collected from Play Store

log in & main menu There is only the normal register option and sign in w/ facebook There is no homescreen, I don’t know if apps has another service such as Bluebird Kirim

booking screen Enable location can't be done directly (must go the phone settings menu first) The area to drag down when booking is too small There is no clarity, when using the metered price, can the tariff exceed the estimated price listed? There is no ewallet payment option combined with cash

booking screen Schedule options only available for today and tomorrow ‘select time’, ‘continue’ and ‘now’ button can be improved Clock is not intuitive Trip purpose doesn't seem necessary the payment option button is not clear enough

easy ride Easy ride’s function is not clear, the explanation is also closed with alert notification


analysis

key points

challenges

easy navigation to achieve learning goals Feedback?

Well, many users have complained about driver fraud, Bluebird's real time response is needed to avoid customer dissatisfaction Wrong Grouping

There is delivery and rent feature in My Bluebird apps, why bother to make each service into 1 group and flow? Lack of Features

There is some big competitor in Indonesia market, we must adapt and try to be better if we want to continue to survive and lead

opportunities Good UI

Current UI of My Bluebird app is good, simple, and nice. But,the type and size of the font, where the writings on the apps are difficult to read, especially for adults Easy Flow

There is no problem to book a taxi. The flow that is owned is good and easy to understand by ordinary people


project map easy naviagtion to achieve learning goals






what i’ve learned

To be able to develop and make new breakthroughs in apps within the next 2-3 years, of course I have to adjust to the company's vision and mission, look at market conditions, and adjust to the wishes of the user.

In this modern era, developers are competing to create superapps that have a variety of features and services. Therefore, I'm trying to embed with other Bluebird businesses into the My Bluebird apps. However, besides that I also have to be realistic, whether this concept is possible to be developed within that time frame.

what can be improved The dark color on the writing need to be more dense Add illustrations to clarify features and services Due to the increasing features and services, an onboarding screen is also needed Improve UI when creating a schedule

scan for video preview


FMS 2.0 Franchise Management System

FMS (Franchise Management System) is Ray White Indonesia's internal system which functions to manage all Ray White branch offices in Indonesia. FMS contains various data, starting from property listings, sales data, commissions, awarding, to reports and distribution of financial data This system is still in the development stage. To access the prototype version, please scan the barcode below


The Story FMS 1.0 was first created in 2014.

Due to limited resources at that time, the appearance of FMS was made modest, only prioritizing its function. As a result, both UX and UI, FMS has many weaknesses.

Over time, there was an issue to add FMS functionality. Therefore, this is considered as the right moment to overhaul FMS 1.0 to FMS 2.0 u

Task Improved the UX of the old FMS and created a new UI for FMS 2.0. FMS will have various users, so the new design needs to take into account the interests of the users who will use this system in the future

FMS 2.0 is also expected to have good responsive design, so that users can access FMS easily via mobile phones.

Executor

Yoseph Duna S

Date

August 2021

Time spent

2.5 months


Step 1.

to define all the user

Who

There are 2 types of users who use FMS, namely Ray White Corporate staff consisting of the finance team and admin team, as well as office admins throughout the Ray White Indonesia f ranchise.

Admin Franchise

The office admin is tasked with entering sales data which will later be distributed to the corporate admin

Admin Corporate

After data f rom all f ranchises is entered, the corporate admin must reprocess the raw data obtained for further distribution to the finance team and become a report to the director

Finance Division

Consists of various kinds of sub users who have their own requirements, such as accountants, tax departments, to finance managers


Step 2.

What

define all user journey when they using FMS

Admin franchise

I do data research by conducting interviews with each user every week

Admin corporate

Role

finance manage tax accountin account payabl account receivabl finance officer admin corporat admin officer

Franchise office admins enter sales and income data at the franchise office

Create, change, and delete property listing data, check data from all franchise admins, check input data from myraywhite.com, update written and trading data, make written and trading reports to be reported to the director and finance manager, etc. Finance division Processing trading data into settled commission, confirmed settled commission data is continued to be settled. Confirming the data that needs to be approved, entering and calculating open house data by the franchise office, making invoices (portal account invoices, one system invoices, etc.), making financial and accounting reports, etc.


Step 3.

What

Grouping & layouting penggunaan layouting menu secara horisontal tidak efektif karena qty menu yang banyak. Akibatnya, jadi

do analysis to the current product

ada 2 baris menu yang ditampilkan

data table the use of horizontal menu layouting is not effective because there are many qty menus. As a result, 2 lines of menu are displayed

unneeded menu & report There are several menus that are repeated so that they can be removed. As for reports, there are actually a large number of reports Screen written menu on FMS 1.0

that are not needed and can be combined with other reports to minimize the number of reports on the report menu


Navigation bar

Step 4.

refine the UI, menu, and table data

The idea :)

Navigation bar

Horizontal menu arrangement is very space consuming. To save more space and make navigation easier, all menus have been moved to the left bar I also have an idea to make the table display more mobile friendly and in accordance with the user, namely by adding a filter to customize the data table After conducting individual studies and brainstorming with users, many main menus and reporting menus can be removed and combined

Navigation bar


Step 5.

create the logic for using the interface for the new product

User wants

In order to

Solution

Search easily even with limited data

Change data, delete data, and do approval if needed

Added advanced filter based on menu or report type

More concise table view

data retrieval is easier so that it speeds up work

Redesign the table format with a modern minimalist look

Looking for any franchise offices that have not input data into FMS

Corporate admins can immediately filter and contact the office admin in question

Add status description with a certain color in the data table

can see historical data on reports

the finance manager needs to check and evaluate the data that enters the report

add a hyperlink feature that connects reports with data sources so that users can navigate between data quickly

Unnecessary reports are removed

so that the list of reports is not too much and makes new users confused

identify which reports are not needed and can be put together, as well as update the UI report menu along with the addition of the report search feature


Step 6.

and after a long journey of research and identifications, here is the results! :)


The default view of data table with new filter option and new improvement to the table


The data in the table can be accessed historically (linked)


The new layouting and grouping of report menu


Now, chart can be combined with table data



Responsive design display for mobile web for easy access via smartphone


END

Thank you for the attention :)


Loan Market Desktop - Mobile website - CMS

Loan Market is a sister company owned by Ray White which is engaged in fintech. This project is to revamp the UI/UX of the old desktop and mobile website, and create a CMS (Content Management Service) from Loan Market website.


The Story Loan Market Indonesia is one of Ray White Indonesia's sister companies which is engaged in Fintech industry. LMI as a third party assists the community in borrowing funds in various contexts and broad programs

Task The loanmarket.co.id was created in 2019. However, the current website is considered outdated and irrelevant to current market conditions and society. Therefore, stakeholders took the initiative to revamp the UI/UX of the Loan Market website to increase sales and enhance branding and company image.

Executor

Yoseph Duna S

Date

May 2021

Time spent

1.5 months


how it works In conducting transactions in the Loan Market, users can use 2 methods. The first method is by directing the user to the nearest Loan Market branch office, and the second method by filling in the initial data online through the loanmarket.co.id website. The initial data obtained from the user will be followed up by the loan advisor to obtain more complete data and documents to be entered into the CRM database. Completed data with bank requirements and procedures will then be sent to the destination bank. The loan advisor will oversee the loan process from start to finish, until finally getting the loan or product that the user wants.

Technical architecture


analysis competitor analysis

Affinity diagram All the information from research was collected and an affinity diagram was made to align all stakeholder’s needs. The affinity diagram below shows the breakdown of information about the customers from interviews, the client and their USP (Unique Selling Point).


user persona Jessica For this project is a revamp project and the time we have to complete this project is very limited, so I only appoint imagine one people who can represent the results of this research.

As a result of the customer interviews and prior research, one distinct personas were formed which help guide reasoning behind certain design choices.


information architecture refine the flow There are so many unnecessary and repetitive flows on the old Loan Market website. So I rearranged the existing flow so that users would not experience difficulties and confusion, and could operate the website loan market quickly and efficiently.


Create the logic for using the interface for the new Loan Market

User wants

In order to

Solution

The registration process is simpler, easier to understand, and faster

visitors who come do not run away because the process is complicated

Improved transaction flow that is easier and reduces unnecessary data entry

Website appearance is more modern and nice

the website is more convincing so that visitors want to transact

improved UI appearance with a more modern theme

Added calculation features, such as a calculator

attract the attention of potential customers

added a mortgage calculator feature that can direct users to CTA

Have a better branding image

Consumers trust and continue to transact

Add company history and profile, testimonials, and transaction steps

Read various articles and news about finance

Attract users to enter and increase the reach and engagement of the website

Fixing the uncomfortable format of the article menu and maximizing the SEO format on the website

Give rewards to customers who invite others

Increase sales and reach through common people

Added a referral feature that benefits both companies and consumers


The Result after do some research analysis, we created the new website of Loan Market :)


New landing pag edesign


the process of choosing what type of loan you want to do


Users can choose a bank according to their individual preferences


New calculator to calculate and simulate mortgages in detail


Article and news menu with new and better layout to access


About Loan Market to engage more user


Loan Market CMS Content Management Service Loan Market CMS is a system created by me for users to create, manage, and modify content on the website without the need for specialized technical knowledge.

Besides functioning to create, edit, and delete web content, CMS also functions to manage user management on the Loan Market website


About it

All data was made up by me, because I have no opportunity to do a deep research due to time limitation. Even so, I have enough experience as a content writer in using CMS and doing competitor analysis to make this product Executor

Yoseph Duna S

Date

July 2021

Time spent

1 week















Thank you :)


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.