UI/UX DESIGN PORTFOLIO

Page 1


Learning Experience

2014-2017

2019

2019

Brawijaya University Advanced Diploma of Visual Communication Design

Purwadhika Coding School Course Web and Mobile Development Jul 2019 - Feb 2020

Purwadhika Coding School

Workshop and Course Foundamental UX design Des 2019

Working Experience

PURWATI ENDAH DARMAYANTI

Jun 2019 Present

UI/UX DESIGNER

Jul 2018 Mei 2019

- Gather and evaluate user requirments in collaboration with product owner, Delivery Owner, engineers and Business Analyst - Make a product from user persona, user journey, user flow, untill wirefremes and prototyping

PT. Mitra Erat Technology ( UI/UX Designer and Head Creative ) - Gather and evaluate user requirments in collaboration with CEO, Stackholder, Engineers Team and Business Team - Make a product from user persona, user journey, user flow, untill wirefremes and prototyping - Make a logo, brand identity, design system, and style design company - Make a produce and visual asset - Make a decision design product design.

purwatiendah22@gmail.com

0877-5495-9145

Feb 2018 Jul 2018

I’m a 24 years old, an Diploma III in major visual communication design of Brawijaya University, I’m Creative, High motivated, a self-help and fast learing person. I loverelated to art and design, Currently I live in Jakarta. My link portfolio bit.ly/portfolio_endah

PT. Prudential Life Assurance ( UI/UX Designer )

PT. Eannovate Creative Technology ( UI Designer and Graphic Designer ) - Make a product from user persona, user journey, user flow, untill wirefremes and prototyping - Make a banner website, Icon, logo and visual asset

Sep 2017 Des 2017

Jul 2016 Jul 2017

PT. Eannovate Creative Technology ( Freelance Illustration designer and Motion Animation designer) - Make Asset illustration, story board, story line, and illutration story board - Make a motion graphic and animation frame by frame. - Make editting video and sound effect.

PT. Fruity Logic Design ( Graphic Design) - Make asset visual, logo, banner, brand identity - Make design graphic for social media like Instagram, facebook, twitter, and website

( Intern Graphic Design)

Interests

- Make asset visual, logo, banner, brand identity - Make design graphic for social media like Instagram, facebook, twitter, and website

Abilities

Photography

Traveling

Languages

ID EN

Music

Drawing

Illustration

UI/UX Designer

Character

Graphic Design

Editing Video

Logo Design

Design Interface

Animation Motion Graphic

Skill PhotoSHop

Marvel app

Premier Pro

Illustrator

InVision

After Effect

Adobe XD

Prototyping

Adobe Animate

Skecth

Wirefreming

Adobe Muse

Figma

HTML

React JS

Zeplin

Boostrap

CSS



PRUHub

UX CASE STUDY This Project is for creating a dashboard web application for fill form Prudential customer . The main objective of PRUHub is to help the user (prudential admin) input data customer easly and quickly with the method Automation Service.


Research process The User Target user is admin prudetial have a habits use life asia to help thier

The Problem

works.

Solution

- user difficult to input data form user with life asia - users slow to service costumer .

User Goal - User could easly input data form costumer - User could easly access pruhub in anytime and anywhere

Based on problem users the application offer the following solution : 1. Building online ecosystem of online form. 2. Provides online forms that can be used by users anywhere and anytime

Costumer Journey

Mariah Scenario Amelia Dwi Santika is a wants to process customer requests

Mariah open pruhub

input data costumer

Process finish and get letter

process doing automation after input data


User Flow Login

Main Dashboard

Menu Paymentout

to workbaket

take case payment out

to brms verification

input data costomer

take decision

Interface Design Login page

Dashboard page

BRMS page


workbasket page

desicion page


QUPintar

UX CASE STUDY This Project is for creating a web and mobile application for make online course to student in elementary school, junior high school, senior high school and student don’t have to go to thecourse place. The main objective of QUPintar is to help the user can be study in everyehere and everytime with online course. the goal of QUPintar is making the user's time more efficient to learning all subjects in school.


Research process The User I defined the target user as : 9 - 18 years old and have a habits use internet.

The Problem

and need improve knowladge.

- course fees are very expensive

User Goal

- users find it difficult to find a suitable course - the course is far away - user need courses to get favorite university.

- User could easly to learning their study in everywhere and everytime. - User could easly take a online courses their want - User could easly set their time to learning.

Solution Based on problem users the application offer the following solution : 1. Building online ecosystem of online study. which provides courses online, library online, tutor online and etc 2. Provided courses online cheaper than courses offline, so user can study everytime and everywhere.

Costumer Journey

Amelia Dwi Santika Scenario Amelia Dwi Santika is a student in 12 classes. and she want take a course suitable with her parent budget.

Amelia Searching courses in internet

he is looking for a cheap course

she found QUPintar as cousers online

she get information

she take a trial online courses

she get information fee of online courses

she buying online courses


User Flow Register

Landing page

Login

Main Dashboard

Menu QU Belajar

Search level study

get a materi in this level

Start to Learning

Wacthing video

get material to learning

get summary with infographic

get Quiz

get pricelist courses

Buying courses

Interface Design landing Page Testimoni user banner web for get user try courses

Animation rocket to get user try trial courses Product in QUPintar

Reason why user to buy packet courses.

choose material


Register and login page

Main Dashboard student

Subject courses page

Material courses page

video page

Quiz page

summary infographic page


 


MY DOCTER Design a booking app

Appointment with Doctor

UX CASE STUDY This Project is for creating a mobile application for make an appointment with a doctor.The main objective of MY DOCTER is to help the user make an appointment or booking schedule with doctor professional quickly and easily. the goal of MY DOCTER is provide time efficiency for user find docter and booking docter quickly


Research process

The User I defined the target user as : 20 - 45 years old and always user mobile phone in the their behaviour. and

The Problem

care with their health.

- Users difficult to make an

Solution Based on problem users the application

appointment with docter

User Goal

- user is difficult to contact hospital - user have a busy schedule

- User could easly to make appointment

- In this condition more effective to make appointment through mobile apps

for check up routine

offer the following solution : 1. Building application to make an appointment with docter 2. Building an online health ecosystem

- User could easly to set a time appointment with docter - User could make an appointment anytime

User Idetification User Persona Behaviour - Always check up her condition once every month - Care with her family - Busy schedule - Looking great doctor

Technology Expertise

Dewi Age : 25 th Job : Project Manager Origin : Jakarta

- Always make IOS mobile phone

Problem - Dewi have a busy schedule and she want to make appiontment with professional doctor. - Someday dewi have a meeting and she must reschedule the appointment with doctor. So, she want change the schedule easily .

Family Oriented Professional Healty Care

Need - Can make an appointment easily - Can knowing the professional doctor in the city - Can reschedule easily.


Emphaty Map Think & Feel

See See professional doctor

Want meet professional doctor

Booking Promosion

make an appoitment easily with doctor

see health video

Want doctor in nearest hospital

news paper & magazine Billboard

USER Hear Social Media

Say & Do Make a doctor easily

Family

Want meet professional doctor

Suggestion from her friends

Want good hospital in nearest area

TV advertisement

Pain point

Gain

- User don’t know where the great hospitas

- User can see professional doctor

- User don’t know where is professional doctor - User don’t know schedule doctor

- User don’t know how to reschedule with doctor

- User can make an appointment with doctor - User can know good hospital in nearest area.

Costumer Journey

Dewi Scenario Dewi is office worker and she have a busy schedule. she want to make appointment with doctor for checkup her health . she want looking professional doctor in nearest hospital and she want used her insurance.


Awareness

want checkup

Preparing

Research

Booking

Searching Searching professional near doctor hospital

open apps

Compere Hour

Thought

when is the date for inspection?

does it have does it have Nearest a professional hospital ? doctor in nearest area?

where is the good hospital?

Touch Point

Own Self

Phone

Phone

Phone

moment of truth

I want check up 1 week later ?

I don’t know where is the good hospital and professional doctor

Maybe, tommorow I can booking o customize with my schedule

cant used my insurance

Opportunity

Apps Aplication

Information information nearest professional hospital doctor

notification to set the schedule

choose the professional doctor with good hospital

Action

Searching schedule

which doctor is good?

Input data

is my data right ?

can use insurance to pay?

Compare Competitors Good - Can search nearest hospital - Call doctor to make an appointment

Halodoc

- Don’t have guide in the page appointment

- Can booking doctor with order

- Don’t have a doctor complete profile

- Use trend illustration

- Can’t use trigger data with profile - Don’t have star for doctor

- Can look the price for consultant - Have a doctor profile - Can know the nearest hospital Alodocter

bad

- have a guide to complete the data form - have a features trigger data user - have a payying with insurance

- Can’t searching the nearest doctor - Don’t use trend illutration


User Flow

Login

Home

Profile Doctor

Appointment

Search Doctor

Search Hospital

Choose a Doctor

Complete the Form

Book doctor

Interaction Design

In hospital list have Menu All Product

a menu search

(Product and tittle

doctors in hospital

description product)


distance between hospital and user

have a step for guide user booking docter

have button cancel maybe user want to reschedule


Conslusion After we do everything from the start, it's time to do usability testing. That's because, we want to make sure again that the user will not find any pain or obstacle again to reach their goals in our application. and always makes users easy to use this app.

or maybe we can redesign and use A / B Testing with optimizely to see which design the user prefers and make useful design to users.

Thank You below is link prototype High Fidelity

https://bit.ly/prototyping_ui


Case Study How to Improve conversion rete from Product List and Product Detail

UX CASE STUDY This Project is for creating a mobile application ecommarce for selling game voucher . The main objective of this app is how to improve conversion rate from product list and product detail


Research Problem User 1. User is not satisfied because seller doesn’t send item to the customer.

2. Increasing item make user complain and buying at other competitors .


Solution Based on user problem , We can offer of solution to solve the problem :

Best Merchant

1. We can offer the new features “Flash Sell” or event “big sell” to get the increase purchase user. 2. and we can selection good merchant and make sign/watermark “Best merchant” in the item and build user trust to buying the item in itemku.

User Journey

Scenario Angga 17th Angga want to buy item skin mobile legend and he not enough money to purchase the items.


Awareness

Preparing

Research

Buying

Checkout item and checking data?

open apps

Compere Price

Searching Good marchent

Searching item skin game ML

Thought

Where is the good store and low price?

What applications sell skin items ML?

where is the trusted store?

Where is low price?

Where is store selling item skin ML?

Touch Point

Own Self

Phone

Phone

Phone

moment of truth

I want play game tonight

I don’t know where is the good store and have low price?

Maybe, letter I want buy the item skin.

I get trusted store and have a low price

Opportunity

Apps Aplication

notification item in Cart

choose good store and promo items.

Action

want to buy item skin

Looking low price items

Information Promo sell

item information hunt

User Flow Login

Landing Page

Flash Sale

product detail

Buy product

Check out

Payment

Take a basket

is my data right ?


Design Low Fidelity / Wireframe Landing Page /Home page

Flash sale Page

Page Product Detail

Page Payment

Design High Fidelity This link prototype High Fidelity https://bit.ly/prototypeUI Thank You

Page Payment Detail


User Flow Prototype

Home Page

Page Product Detail

Page Flash Sales

Page Product Detail

Page Payment

Page Payment Detail

Finish Transaction



 

  


  

 


 

  








 


 


 

  


  

 


 

    



:  :  : 

: 



: 

: 

:  :  : 

: 

: 

: 

  :  :  :    

  

    

: 

: 

: 












    



 








 

 



  

    


  

  

  

  


     

  


   

  



freelancer manage social media pasarwarga feb 201 - mei 2019

Design Social Media for Pasar warga


Design Social Media   for wifi.id

 



 

 


 

 

  

 


 

 


 

   


     


TH A NK YO U purwatiendah22@gmail.com 087754959145 @endah_design_ @Endahmaya_d

Endah maya Purwati endah darmayanti

Purwati endah darmayanti

Maya endah

Link web portfolio http://bit.ly/portfolio_endah


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.