A ST R A DA I H AT S U

Astra Daihatsu
Mobile App.

2 0 2 1
S E P T E M B E R
Hello.

Creative-Engineering Company.
 Aleph is a creative engineering
company building a better future
for people everywhere.

15 Years of Blending Design and Technology.

Today, we are over 400 breed of creative and engineering talents, consists of artists,
craftsmen, strategists, and technologists spread across the region.

🇸🇬 🇮🇩 🇲🇾 🇦🇺 🇹🇭 🇻🇳 🇵🇭


 Singapore Jakarta Malaysia Australia Thailand Vietnam Phillipines

Studios.
 STRATEGIC
Content
Strategy

Service Brand
Design Strategy
Tech
Strategies Systems
Infrastructure Process Innovation
Comms
Strategy

Ai Cloud Mobile CMS Platforms Experience Design UI/UX Communication Design Branding Marketing Advertising

Mobile
Development
Product
Software Product Design Launch
Engineering

Brand
Identity

Copywriting
HTML
Illustration

PRODUCTION




















 🇸🇬

🇮🇩

🇲🇾

🇹🇭

🇻🇳

🇵🇭

🇦🇺

Regional Experience.

 Crafting Bold Ideas.

Banking
Telecommunication
Airlines
Insurance
Automotive
Others

 C R A F T 🇸🇬

The first to introduce

contactless payment in
Asia Pacific.
UOB Mighty

Mobile Banking

NFC & QR Payment

Mighty Deals

Mighty FX

UOB Business Banking

C R A F T 🇸🇬 🇹🇭 🇮🇩

Banking for the Next

Generation.
Digital Onboarding with E-KYC

Virtual Wallet

Smart Accounts and Insights

Product Customisation

Content Design

 C R A F T 🇲🇾 🇮🇩

Best virtual banking

experience in the region.
Maybank2u

Web and Mobile Banking

Maybank Anywhere Everywhere (MAE)

Virtual Wallet

Wealth and Trading Platform

Maybank SME Solutions

Best Public Website in 2020

C R A F T 🇲🇾 🇵🇭

Clicks in Malaysia
and Philippines.
CIMB Clicks

Web and Mobile Banking

Virtual Wallet

CIMB Wealth Wall

Loan Applications

C R A F T 🇮🇩

Reimagining
Permata Bank.
Permata MobileX

Permata Net

Permata API

Permata Store

Permata Web Experience

Permata Brand Experience

C R A F T 🇵🇭

The first virtual bank

in Philippines.
Personal Banking

SME Banking

Corporate Banking

Wealth Management

C R A F T 🇹🇭

The most admired

bank in Thailand.
Personal Banking

SME Banking

Corporate Banking

Wealth Management

C R A F T 🇲🇾

Building a trading
platform from zero.
Trade Stocks on Mobile, Tablet and Web

E-KYC Onboarding

Create Multi-Currency Accounts

Public Web Experience

Content Design

C R A F T 🇲🇾

Super You:
Insurance, Personalized
Aleph teamed up with Sequis Online to
disrupt the insurance industry in Indonesia .

We created a millennial-friendly insurance

product that uses Artificial Intelligence
(SOVIA) to give quotes and suggestion
product that user need.

We also helped to create the Brand Identity

for this new insurance product.

 C R A F T 🇲🇾

An inclusive and virtual

Islamic Banking.
BIIB and GO

Web and Mobile Banking

Virtual Wallet

Smart Accounts

Community and Donations

Live Chat

From Utilitarian to Influencer Brand

C R A F T 🇮🇩

The first virtual telco

brand in Indonesia.
Mobile Experience

Product and Service Management

Personalised and Customised Products

Deals and Content Design

By.U Games

 C R A F T 🇲🇾

All-in-one experience
for Digi users.
MyDigi

Product and Service Management

Personalised Products

Deals and Content Design

Lifestyle Rewards

C R A F T 🇮🇩

The first consumer-

focused Telco.
Public Web Experience

Mobile Experience

Product and Service Management

Lifestyle Rewards

C R A F T 🇮🇩

Digital Assets and Design

System Management.
Mobile Experience

Data and Analytics

Design System

C R A F T 🇮🇩

The leading E-Sport

platform in Indonesia.
Web Experience

App Experience

Community Platform

Data and Analytics

Design System

HO
EUL LROV I S I O N

We believe that your app experience

should meet real user needs whilst
accomplishing business goals. This
comes with rst understanding the
people and process involved in the
end-to-end journey.
fi
VISION

Building the right experience

to enhance the user
engagement and improve
efficiency in the process.

How might we design a companion app for our users

that is enjoyable, while helping to improve the user

engagement and the whole process from end to end.

TO DAY

The current Astra

Daihatsu App still in
functional level and
didn’t meet the
current users’ need.

OPPORTUNITY

Bring the app to meaningful level by having new features to ful ll the

current users’ need and build the right integrated app experience as

the true one app to serve our customers.

fi
A N A LY Z E

Landscape Analysis
Our desk research to study on our competitors and

who’s the best in the market.

L A N D S C A P E A N A LY S I S - O V E R V I E W

Capturing the current landscape of car

focused applications from local and
global competitors.
5 Car Manufacturer Apps

2 Car Utilities Apps

L A N D S C A P E A N A LY S I S

Dashboard
Personalized Dashboard
With various type of cars available to connect with the app, both

KIA and Hyundai provide only contextual information to the

users based on their car ownership. To provide more ease of

access, the app also connects to smartwatch.

Feature Focused
Both FordPass and My Mitsubishi Motors provide clear starting

point for the users by giving feature buttons for browsing right

away.
Customizable Menu
mTOYOTA lets users to customize which menu they would like to

place on the dashboard. It especially helpful when product and

service are varied.

L A N D S C A P E A N A LY S I S

Features
Remote Car Control
KIA, Hyundai, and Ford connect the user’s devices with their

vehicle to elevate driving, security, and control experience.

To use these features, car owners of KIA and Hyundai need to have

additional subscription.

Product Upsell by Integrating

Purchase Journey

mTOYOTA provides ‘Find Your Match’ feature, a short quiz for the

users to nd a car of their needs. With this feature, the users will

get a recommendation of suitable cars which makes the journey

fun and easy, in addition to leveraging product and feature

exposure.
fi
Vehicle Health
KIA, Hyundai, and Ford are starting to shift to V2C (Vehicle to

Cloud) focused app. With V2C, car sensors collect data to provide

more value to the driver with various insights, from real-time

data to predictive maintenance analytics.

For example, Hyundai provides detailed health information to

suggest action for service or maintenance.

 Financial and Trip Analytics

Simply Auto and Drive offers management feature for vehicles,

starting from cars, motorcycles, trucks, to eets.

Financially, the app tracks vehicle-related expenses (fuel,

registration, driver income) and present the expense through visual

chart.

Both apps are also useful to assist managing vehicle data for

regular services reminder, mileage, and trip log.

fl

L A N D S C A P E A N A LY S I S

Engagement
Gami cation
mTOYOTA use gami cation to increase engagement. The points

are redeemable with voucher as gifts.

fi
fi
 Personalized Rewards
Mitsubishi and Ford both offers its promotion through a dedicated

page.

Mitsubishi provide rewards from My Coupon menu and let the

users choose between service booking or walk-in option to utilize

their coupons.

Ford gives out rewards from purchasing spare parts or vehicle from

of cial dealers and completing brand experience (survey, video).

The points is redeemable for repairs, add protection, purchase

parts/vehicle, pay taxes, and get licensed merchandise.

fi

 L A N D S C A P E A N A LY S I S - O V E R V I E W

MY MITS UBI S HI KI A ACCE SS WITH MY HY UN DAI WITH

DA IH AT SU KU MTOYOTA FO RDPAS S D RIV VO S IM PLY AU TO
MOTORS I D UVO LINK BLUE LI NK

Downloads 100 K+ 100 K+ 100K+ 100K+ 500K+ 1M+ 1M+ 500K+

Rating (Play Store) 4. 6 4. 0 4.6 4.3 4.7 4.3 4.7 4.6

Rating (App Store) 4. 0 N/A 4.8 4.6 4.7 4.6 4.7 4.3

Product List

Car Catalog

Spare Part

Insurance

Engagement

Community

Gami cation

Promo and Reward

fi
L A N D S C A P E A N A LY S I S - O V E R V I E W

MY MITS UBI S HI KI A ACCE SS WITH MY HY UN DAI WITH

DA IH AT SU KU MTOYOTA FO RDPAS S D RIV VO S IM PLY AU TO
MOTORS I D UVO LINK BLUE LI NK

Features

Service Book

Book Test Drive

Expense Analytics

Trip Logs

Remote Car Control

Vehicle Health

Service Reminder

IoT

Help

Assistance (chatbot,
CS, call)
K E Y TA K E AWAY S

Informative

Providing information about vehicle, booking, service, and promotions

Free to Access Membership

(Ownership)
(Ownership +
Subscription)

Functional

In addition to informational purpose, it adds value to elevate the vehicle experience through apps

THE INSIGHT

Digital age customers are

reshaping the dream car idea
into a connected and
personalized car with the
immediacy to their digital
ecosystem.

Globally, the demand for connected cars is doubled and

willingness to subscribe driving related app proved to be

higher than unrelated driving app.

Source: McKinsey; McKinsey; McKinsey

THE INSIGHT

Digitization has People are holding onto their vehicle longer (up to 6.5 years)

become a driver to but willing to switch brand for connectivity.

higher car productivity

and better customer The pandemic has created customer base who are inclined to

car ownership and accustomed to digital-based functionality.

satisfaction in the
industry, but the need
has not yet met the 40% of people who owns a car don’t plan for maintenance and

need reactive service reminder.

user’s demand.

Source: BCG; Think With Google; Think With Google

THE INSIGHT

Setting new standard in

Indonesia connected car
ecosystem.

Elevate the customer's experience by meeting them at the

right point of their journey focusing on the mobile rst

95%
approach.

• Mobile devices allowing driver to acquire fast help in

times of needs and enable them to take action easily.

• Mobile ads help to drive 103% increase in scheduled

Vehicle buyers use digital as a source of information.
service appointments.
60% of them comes from mobile device search related to dealership,

spare parts, service, and maintenance.

Source: Think With Google

fi

THE INSIGHT

App Market Customer’s Voice

Current customer expectations:

• Customers are waiting for upcoming feature updates

• Booking service clarity and details

• An improved in-app shopping experience

H E U R I ST I C E VA LUAT I O N

UX Audit

We analyze current DaihatsuKu Mobile App

Heuristic Evaluation. And ranked on a scale of 1 to 4 for severity of impact.

This current app analysis is conducted based on the following

8 accessibility and usability heuristics. 1 Cosmetic

Need not be fixed unless extra time
is available on project
1. Visibility of System Status

2. Match Between System and the Real World

2 Minor Usability Problem
Fixing this should be given low
3. Consistency and Standards priority

4. Error Prevention
3 Major Usability Problem
5. Flexibility and Ef ciency of Use Important to fix, so should be
given high priority
6. Aesthetic and Minimalist Design
4 Usability Catastrophe
7. Help and Documentation
Imperative to fix this before
8. Accessibility and Inclusion product can be released

fi

UX AUDIT

Onboarding
AREAS OF IMPROVEMENT

4 Flexibility and Ef ciency of Use

Pre-login state may hinder non Daihatsuku users to explore

the app. The features doesn’t add much value for users unless
they are signed up to the app.

Impact: Users might feel forced to sign up without having a

glimpse of the feature bene t and how it works, which may
cause them to leave the app entirely.

R E CO M M E N DAT I O N

Clear separation between pre-login and login session.

fi
fi

UX AUDIT

Dashboard and Content

AREAS OF IMPROVEMENT

3 Consistency and Standards

Inconsistent language use. The users are exposed to two

Copy can be further
different language: English and Indonesian. While the main
improved to provide
dashboard and navigation bar displayed the copy in English,
consistency across app.
any other content uses Indonesian.

Impact: Some users might feel confused and overwhelmed

with unfamiliar language especially when they had no control
over it, which may lead them to be frustrated.

R E CO M M E N DAT I O N

Improve setting control to provide more accessibility and

tailored preference for the users of DaihatsuKu.

UX AUDIT

Banner Content
Photos don’t effectively
AREAS OF IMPROVEMENT
convey the message since
the content is way too
3 Flexibility and Ef ciency of Use
small to read.

Promotional banner does not include any hyperlink or CTA

button. Right now, it is strictly information in long paragraph.

Impact: It will requires more effort from the users to nd the

desired promo in other platform, like looking for the content in
website without actually redirecting them right away. This may
lead the users to get frustrated and abandon the promo
completely.

R E CO M M E N DAT I O N

Redirect users to the right page with CTA or hyperlinks and improve
key visual to engage them exploring the content. This will
encourage upsell/cross sell through promotional banner.
fi
fi

UX AUDIT

Catalog Products
AREAS OF IMPROVEMENT

4 Accessibility and Inclusion

Colors and button size are not entirely accessible. Some of the
text is hard to read and the button size and distance are too small.

Impact: Users might nd a hard time to digest the button

function, as the color may not be accessible for some people with
Inconsistent color used
vision problem. This could be a fundamental barriers that prevent
may create visual noise, in
them from enjoying the experience just as much as the next user.
addition to hard to read
text due to the choice of
color.

The smaller and closer the

R E CO M M E N DAT I O N
target button, the longer
Implement a design system across platform with accessibility in time users can access the
mind. This will help to ensure no locked gate on the whole button function (Fitt’s

experience for every kind of users with different capabilities. Law).

fi

UX AUDIT

Catalog Brochure
AREAS OF IMPROVEMENT

4 Aesthetic and Minimalist Design

Car details need to be download as picture. Product information

may not be able to digest easily because of this format type, Photos don’t
which place no difference with traditional brochure. effectively convey the
message since the
Impact: Users would not get a proper explanation regarding the content is way too
product as this touch point is not fully used to its capability. small to read.
Downloaded le provide evidence of zoom-in limitation.

R E CO M M E N DAT I O N

Explore ways to embed car details onto the page itself. It is

important to provide less hassle for the users when interacting with
product and information.
fi

UX AUDIT

Product Detail
AREAS OF IMPROVEMENT

4 Flexibility and Ef ciency of Use

Unclear active button. This functionality interaction may not be

visible to some users, as it seems to be a list of non-clickable
product and CTA is hidden under the list. Collapsible section is
hindering users to use
Impact: Users may only scroll through or view the list which only these features.

leads them to miss meaningful features.

R E CO M M E N DAT I O N

Seek ways to improve the issue by bringing the feature upfront with
clearer CTA placement so that users can request or simulation
easily.
fi

UX AUDIT

Vehicle Detail
AREAS OF IMPROVEMENT

4 Error Prevention

The system understand possible problem scenario. However, the

only CTA for this problem is cancel, which does not give better
understanding of how they can achieve this goal. No other method or
additional explanation for
Impact: Users might wonder if there were any other method or this problem.

leave the page entirely since they could not possible use this
feature.

R E CO M M E N DAT I O N

Explore ways to integrate vehicle detail and users data, which can
alleviate their experience when using the app. Or else, provide
error state to guide them overcome their constraints.

P R O D U CT F O U N DAT I O N

Creating Value
Building the foundation of our products and services

focused to solve real problems.

 “I don’t want to maintain my car all the time
since I lack understanding in mechanical area
and I’m mindful about my spending.”

Goals and Aspirations Pain Points and Challenges

Yusuf, 24
E A R LY A D O P T E R S
• I want to take of my car maintenance • Unsure when is the right time and problem when
regularly and swiftly maintaining car health in services
• I want to be more aware of how my • Keeping up with monthly budget especially when
vehicle spending affect my budget he got a lot in his mind

Recently graduate with degree in

economy, he finally achieved his
dream to start a business. To expand
his asset ownership, he finally chose
to get a car over apartment to
commute between home and his
business space.
Reasons to Use
• Easier way to get necessary information
and notification about his car
• Monitoring expenses and bills
Reasons to Purchase
• Wants to utilize his car manufacturer
benefit as maximum but easiest way
possible
• Saves time and effort

 Yusuf
E A R L Y A D O P T E R S

V A L U E P R O P O S I T I O N D I A G R A M
Clear Service
Information
Economy
Flexible spare Time efficiency Promo Coupons service package
parts options

Pick Up Service Cashback or

GAIN
GAINS
C R E AT O R S Points when do
Routine Car
Service Week service at
Cost Efficiency Maintenance
authorized dealer
Paying Vehicle
Registration
PRODUCTS Able to book and
Renewal JOBS Service Reminder
& SERVICES get time
Manage Spending
For the Car estimation for the
service
Fake Spare Parts Pick Up for Service
Don’t have time to
do the car service PA I N
PA I N S RELIEVERS
Someone pick up
Paying the
and do the service
Lack of knowledge installment
Service Fee for me
about car technical Use non technical
Expensive Cost for Calculator
issue terms
service Special discount or
promo for service


Adi, 45
L AT E M A J O R I T Y
His value for his family gets him to be
hyper-aware of security and safety for
driving on the road. His wife and
children are often share their vehicles
but he relies on himself for looking
after 3 cars. From time to time, it’s
getting too much for him.
“It’s important for me to monitor my car closely
to keep me and my family safe on the road.”
Goals and Aspirations
• Would like to be able to monitor my
vehicle health easily after my family
member uses the cars
• I want to stick to my preferred and trusted
dealer
• I want to manage car insurance and
reminded about other expense easily
Reasons to Use
• Reliable assistance to help him with
vehicle-related information
• Remotely maintain his car health without
having to personally maintain it every
weekend
Pain Points and Challenges
• Managing and monitoring more than one car is a
hassle for me
• Unsure which dealer in town I can rely to
• I want my family and car to be safe on the road,
but unsure which insurance policy to choose from
which company
Reasons to Purchase
• Clear information about his cars health
• Additional reward for regular car
maintenance
• Easy to manage car renewal expenses
and insurance policy

 Adi
L A T E M A J O R I T Y

V A L U E P R O P O S I T I O N D I A G R A M

Profile Integrated Authorized Dealer

Fast Payment with Vehicle Locations
Process Booking Information
Assurance
Booking
Saved payment G A I N confirmation with
GAINS options service detail
C R E AT O R S
Seamless Tracker Paying Multiple Monitor Vehicles Car Health
Car Insurance Health Monitor
Premium
Start promoting
PRODUCTS
JOBS Service Reminder Astra Group
Have to do & SERVICES
Managing Insurance product
payment one
Paying More than Insurance from Roadside
by one
1 Vehicle another platform Assistant
Registration PA I N
PA I N S Renewal REPortal
L I E Vfor
E RCar
S
1 App to overview
Have to track License Payment all his cars
everything one by Visit preferred Integrated
one Uncertainty of Authorized Dealer Payment for Car
service booking Registration &
slot Insurance Renewal Integrated Car
Ability to book
service slot Insurance Payment






E X P E R I E N C E ST R AT E GY

Design
Foundation.

Our design foundation to build a sustainable and meaningful products.

D E S I G N F O U N DAT I O N

Current Brand
Outlook.

The current brand treatment is using a lot

of graphic elements and pattern with Banner Online Event

multiple color combination.

CONCERN

The current treatment might give

negative impact to Readability,

Accessibility and Focus.

Banner
Instagram Post
D E S I G N F O U N DAT I O N

Universal Brand Treatment.

Best practice sample of a universal brand treatment.

Print App Web

 D E S I G N F O U N DAT I O N

Design Principle

Simple Helpful Accessible

Our design should elevate the user Be there for our users at every step The rst rule to get more users is

experience, making everything of the journey, be clear, and give a making our app accessible for

simple to use. delightful experience. everyone to use.

fi
D E S I G N F O U N DAT I O N

Accessibility
Contrast - Level AA
We committed to follow and comply with

the best practice for accessibility.

✅ Minimum Contrast ⚠ Fail - Not pass color

Standard for Readability contrast standard

D E S I G N F O U N DAT I O N

Accessibility
Contrast - Level AA
We follow the global accessibility standards

and guide based on WCAG 2.1 Contrast.

The visual presentation of text and images

has a contrast ratio of at least 4.5:1.

D E S I G N F O U N DAT I O N
A DJ U ST M E N T 2

ORIGINAL A DJ U ST M E N T 1 A DJ U ST M E N T 3

Brand
Implementation.

Components objective:

- Cleaner look to enhance readability

- Brand should be able to communicate clearly

- Easy to recognize to reduce cognitive load

- Accessible for everyone

R E CO M M E N DAT I O N

Good Contrast and Simplicity

D E S I G N F O U N DAT I O N

Improving
Usability with
Inclusive Design.
We believe that our brand should be able to

communicate well for everyone. So we did test

the best color combination and run it through

color blind simulation.

D E S I G N F O U N DAT I O N

Two Design Foundations

UI Components Brand Accents

 D E S I G N F O U N DAT I O N

Recognizable
Part I. Building the
UI Components.

Components objective:

- Easy to recognize to reduce cognitive load

- Intuitive to increase adoption rate

- Accessible for everyone

- Responsive components that works in

multiple device screens

Intuitive
& Accessible



D E S I G N F O U N DAT I O N

Part II. Crafting

Brand Accent.

To make the app unique and able to deliver the

Daihatsu feeling, we carefully craft a few

components that can be injected with the brand

Brand accent
accent. In this preview, we use the card as a

sample of the brand accent.

C R E AT I V E S PAC E

Visual Exploration
Our explorative approach to imagine the new user experience.
 YUSUF’S STORY

Yusuf

Yusuf is a 24 years old millennial who are eager to

own his rst car. After doing some research, and

lots of watching car review video on YouTube,

Yusuf nally made his choice, he choose the new

Daihatsu Rocky. He went to the dealer to see the

car physically and made the deal.

OPPORTUNITY

How might dealer and sales team help to promote

usage of the app to the new user of Daihatsu?

fi
fi

DA I H AT S U WO R L D

Start

OPPORTUNITY
At the dealer, the salesperson told Yusuf that manual
Use the app as a digital channel to replace manual
book of the car can be accessed through the app.
book and how to’s.

D I G I TA L M A N UA L B O O K

OPPORTUNITY
Yusuf download the app, check the manual book and
Help user onboard and use their new car in a fun way.
check his details to do before leaving the dealer.

CAR DELIVERY TRACKING

OPPORTUNITY
The delivery day arrives, and Yusuf conveniently
Giving clarity in every situation, to keep our user
track the progress through the app.
informed. For example if it’s delayed or will arrive

sooner, we should update the user.

M Y DA I H AT S U

OPPORTUNITY
Now, Yusuf can use other menu of the app which is My
Tap in to user daily needs and provide user with the
Daihatsu. All the details of his new Rocky shown here.
right information and tools to keep them engaged

with the app.

SERVICE REMINDER

OPPORTUNITY
After 120 days of using the app,
Keep engaging our user, giving contextual
Yusuf get a noti cation about his rst service.
information and reminder to help our user with their

car maintenance.

fi


fi
SERVICE COUPONS

OPPORTUNITY
Yusuf open the noti cation, redeem his coupon to get
Service is something that our customer will do as a
FREE service and book the service.
routine, we can actively engage with our user and

always be there for our user. We can also digitize the

physical coupon for the rst free service as a

redemption.

fi
fi
SERVICE BOOKING

OPPORTUNITY
Yusuf easily select the service options, he choose the
Bring our service closer to our user through exible
nearest branch near his house and set his preferred time.
and easy to use feature. Make every user feel special

cared.

fl
CUSTOMER FEEDBACK

OPPORTUNITY
The service nished, Yusuf get a reward points and can
Gather feedback from the user for better internal
also give feedback. The service also come with 2 weeks
improvement and also offer satisfaction guarantee for
satisfaction guarantee.
the user.

fi
R OA D S I D E A S S I STA N T

Finish

OPPORTUNITY
One week after using the car, Yusuf feels something is
Tap into user emergency moment, and give them
wrong with the brake system. He called the Roadside
peace of mind.
Assistant to check and make sure that everything is OK.

FUTURE THINK

And the App Keep Growing.

Yusuf always update his DaihatsuKu app. In the

latest update, Yusuf experience a big leap of the

app. He can control some of his car function like

starting the engine, lock or unlock the door, and

even turn on the AC just by using the app.

USER LABS

User Testing

We go back to the user to validation and measure our product.

USER LAB SESSION
USER LAB SESSION

Scan to view the User Lab Session

or click here to view

 RESEARCH OVERVIEW

Research Method

Visual Appeal Test based on Microsoft Desirability Toolkit

Respondents of the survey were exposed to a 5 different designs from various

apps and were asked to give at least one impression based on the listed words.

We asked 100 people Reaction words, include:

for their perception POSITIVE

about 5 app designs. •

•
Straightforward
Comfortable
•

•
Organized
Clear
•

•
Friendly
Familiar

N E G AT I V E

• Boring • Overwhelming • Unattractive

• Hard to Use • Gets in the Way

Source: September 2021 Aleph - Design Survey, (n of 100 Indonesian

young adult (18-34) and older adult (≥ 35-50)).

R E S U LT O V E R V I E W

Top 5 words people chose to perceived the design:

CLEAR FA M I L I A R U N AT T R AC T I V E CLEAR CLEAR FA M I L I A R U N AT T R AC T I V E BORING U N AT T R AC T I V E BORING

ORGANIZED F R I E N D LY FA M I L I A R ORGANIZED ORGANIZED F R I E N D LY CLEAR FA M I L I A R CLEAR ORGANIZED

ST R A I G H T F O R WA R D ST R A I G H T F O R WA R D CO M F O RTA B L E ST R A I G H T F O R WA R D ST R A I G H T F O R WA R D
DA I H AT S U K U D E S I G N

Result shown that people Comfortable

6
17

perceived design A positively Friendly

11
22

compared to the design B. Organized

27
29

33
Straightforward
28

A B 41
Familiar
17

56
Clear
34

19
Boring
34

18
Unattractive
35

2
Hard to Use
12

2
Gets in the Way
11

1
Overwhelming
13

15

30

45

60
K E Y TA K E AWAY S

A B

Between the two, design A

received 57% higher favor on
the positive reaction word
compared to the design B.

“With similar feature, I feel that everything on design A's structured

more comfortably than design B. Without any illustration, I can also

digest the information on design A easily.”

POSITIVE REACTION POSITIVE REACTION

Chrisma - Interviewed Participant

196 125 Daihatsu Terios 2018 Owner

N E G AT I V E R E A C T I O N N E G AT I V E R E AC T I O N

42 105


DESIGN HANDOFF

Creative
Engineering.

Our collaborative approach to build better products.

C R E AT I V E E N G I N E E R I N G .

System Flow.
A practice of understanding
the whole journey to craft a
better experience.
C R E AT I V E E N G I N E E R I N G .

System Flow.
C R E AT I V E E N G I N E E R I N G .

System Flow.
Simplicity by understanding
the complexity.


C R E AT I V E E N G I N E E R I N G .

Process Under
the Hood.
By understanding what is happening under the hood,
API: get_vehicle_data
we can optimised the technology to elevate the Source: Middleware
experience, such as: Call: Asynchronous
Rendered: #1
- Faster loading time
- Giving clarity with specific error hint
- Future-proof systems, easy to manage and sustainable

C R E AT I V E E N G I N E E R I N G .

Data Availability
Under the Hood.
Understanding what data that is available will
Humanising raw data,
help us to give the right information for our Turning it into more
user and gives us clarity on what service to useful and easy to
understand data.
improve from the technology.

C R E AT I V E E N G I N E E R I N G .

Design x API Response.

All the team member should aware on the data API: get_vehicle_data
Data Return:
availability, what we’re getting from the API
response. Communication is key, during the
sync up meeting with the tech team, it’s good
to share this knowledge so that we know whats
available and if we want to improve it to fulfil
the user need we can measure the effort.

S U STA I N A B L E D E S I G N

Design
Systems.

Enabling sustainable and scaleable product through design.

C R E AT I V E E N G I N E E R I N G .

Design System.
We define the smallest of UI elements as
atoms (i.e. buttons, text input, accordions,
or checkboxes) and increasingly larger
components as molecules composed of
atoms (i.e. a navigation menu, pop-up or
toasters, card tiles, modal boxes). The idea
is that as an atomic design system develops,
it will lead to an increase of work velocity,
scale faster and and eventually to entire
layouts, pages, and journeys.

#designonce #deploymany

C R E AT I V E E N G I N E E R I N G .

Atomic Principles.

Increase Velocity Scale Faster Innovate More

Assemble digital experiences from a set of pre- Instead of punctuating our products with With a design system, designers and engineers

existing atomic components makes the product disjointed design elements, we can ensure that doesn’t need to spend time thinking about how a

design process dramatically faster. Not only does it designers are working from the same UI library as button looks, or what styling to provide a form

reduce the amount of re-work for designers, but it captured in our design system, resulting in a better field. Those decisions have already been made by

also reduces re-work for engineers. user experience. a dedicated team.

 BRAND
B U I L D I N G A S Y S T E M

A RT I FA C T S
Along with increasing your ability to

GUIDELINES
communicate clearly within your team,
PRINCIPLES
having UI Framework also makes changing
COLORS
content across your design incredibly

simple. Done properly, modular design will

TYPOGRAPHY
ELEMENTS
exponentially decrease production time
ICONOGRAPHY
and increase bottom line.

BUTTONS
COMPONENTS
#DesignOnce #DeployMany
INPUTS

MODALS

Ways of Working.

We understand the need for close collaboration; not only to understand your current business but also your future

ones. Our aim is to work closely to support your teams and add value. Driving transformation across your teams

with the right knowledge and capabilities, and equipping them with the right tools to be ready for the future.
 Research & Platform Data & Ops &
Design Content
Strategy Engineering Comms Training

A G I L E D E L I V E R Y

To achieve an end state of scaled and personalised experience that

drives our shared mission through these pillars of value.

Pillars of Value.





 BUSINESS

Our goal is to discover

opportunities for innovation
from understanding user USER

desirability, business viability

and feasible technology.

TECHNOLOGY
Triangulate Method.
 Emotional Innovation USER Services Innovation
Meaningful Ex periences Fu nc ti o na l E xp er ie nc es

DELIGHTFUL EXPERIENCE

BUSINESS TECHNOLOGY

Process Innovation
C us to me r E x pe ri enc e s

Triangulate Method.
 BUSINESS

Focus on building great user

journeys based on newly
discovered and innovative
USER
value proposition.

* Define value proposition based on the jobs-to-be-done.

Triangulate Method. TECH

 BUSINESS

Focus on data-driven insights

and user problems by
identifying user personas and
USER
understanding
what they value*.
* Defining jobs-to-be-done by users.

Triangulate Method.

TECH


 A N A LY S E C R A F T T E S T

Problem Solution Validation

Space.
UX Research
Heuristic Study of Current Platforms
User Interviews / Surveys
De ning the User Personas
Design Charrette*
Space. Space.
Design Sprints User Labs
Information Architecture Usability Testing
Wireframing Desirability Testing
Moodboarding Expectations vs Experience Model
UI Component Design Insights-Driven Design

Design Thinking & Co-Creation Workshop Page Layout Design

Iterative Process.
fi

 Our Creative Process I NPU T

R e searc h Des i g n P ri nc i pl e Us a bil it y Te st in g

Human C ent ered Desi g n
D e e p In te rv i ew Wor kshop Value P rop os i tio n C a n va s U X A ud i t IA Co nc ep t Tes t in g

Crafting
We want to
We analyse the How might we We analyse our creative solutions We re-validate to
understand our
process serve their needs? current services and product our users
users
foundations

R e s e a rch S yn th esi s U ser P erso na Pers o na Ex p ec ta ti on U s er Jou rne y U I/ U X De s ig n NPS

Ser vic e Bl uepr int Des i g n S y ste m S US

P roto typ e Cu s t o m er I ns ig ht

OU TP U T

ANALYZE
 A N A LY S E

We start by analysing and

empathising.

The orchestration and optimization of people,

processes, and craft in order to amplify design’s
value and impact at scale. We conduct an iterative
act of design which start from building empathy with
users and challenge assumptions— a human insights-
driven approach to design and problem solving.

#designcharrette
Ethnographic Research.
Gathering data from research and
observations with real users or case
studies. We observe how they interact with
current products and brand. Our goal is to
discover insights and opportunities.
DESIGN CHARRETTE
Landscape Analysis.
Landscape analysis involves assessing
competitor sites to see how they design for
their users—potentially solving for similar
user needs. It can also show what users
will expect if they've used similar sites.
DESIGN CHARRETTE
Mind Warm-Up.
Let’s begin by making a snapshot of
connections and relationships. Using the
5W1H framework, in order to build a quick
overview of your problem area. The result
will serve as reference for future ideation.
DESIGN CHARRETTE
 User Persona.
Personas are ctional characters used to
represent typical users. They are de ned
from a synthesis of data from real people.
A persona should communicate
motivations, frustrations and attributes.
Affinity Diagramming.
An a nity diagram is generated by a group
of people, consisting of designers as well
as stakeholders. Participants collectively
go through user insights and build on
speci c problems or observations.
Card Sorting.
Card sorting is a method that allow
stakeholders to participate in the design of
an information architecture. Card sorting
involves sorting and organising
information into meaningful groups.

DESIGN CHARRETTE DESIGN CHARRETTE DESIGN CHARRETTE

ffi
fi
fi
fi
CREATE
 CRAFT

Increasing crafting
velocity through sprints
and design systems.

Assemble digital experiences from a set of pre-

existing atomic components makes the product
design process dramatically faster. Not only does it
reduce the amount of re-work for designers, but it
also reduces re-work for engineers.

#design-spints #design-systems
A p r i l 2 0 2 0 - N o w

Collaborating
from home :)
We facilitate virtual workshops to align teams and using human-
centred design we co-create by identifying key problems in the user
experience and turning them into opportunities. Knowledge sharing
going both ways as we cultivate the exchange of insights between
Aleph and your stakeholders.

#onlinecharette #co-creation

 User Journey Mapping.
An exercise of presenting and describing
every important step of a single
experience. It includes what the user is
doing, thinking and feeling. This gives
clarity of the entire user journey.
DESIGN CHARRETTE
fi
fi
Information Architecture.
Card sorting is a method that allow
stakeholders to participate in the design of
an information architecture. Card sorting
involves sorting and organising
information into meaningful groups.
DESIGN CHARRETTE
Mood Boarding.
Mood boards are used to visually represent
design ideas, concepts and values in an
open-ended and evocative way. It should
encourage discussion and idea generation
to de ne speci c visual style.
DESIGN CHARRETTE
Sketch-storming.
Sketch-storming is a method used by
designers to visually represent and depict
physical aspects while composing an idea
for a product or service. They are quicker
to materialise - numerous ideas without
compromising valuable resources.
ff
fi
Wire-framing.
Wireframes are line drawings that show
the fundamental structure or functions of a
product or service. It’s an extension of
sketching, wireframes o er a formal way
for designers to think, communicate and
prototype what the design can do.
Design Mockup.
Mock-ups focus on visual aspects such as
style and color, whereas wire-framing
focus on structure and functionality. Mock-
ups allow for exploration of speci c form
factors such as how users would like to
experience the feel of a product or service.
Workshop
Highlights
Lean collaboration with business,
tech and design team by putting
product priorities together.

Product alignment to handle

product release and deliver the
best result for our customers.
TEST
 TEST

Insights-Driven Design
and Measuring Growth.

We understand the need to test our products; not

only to understand if they solve the user’s problems
but also to get further insights to our future releases.
We have established a ‘learning’ and fail fast to
succeed mindset.

#user-labs
Prototyping.
Prototypes typically explore the tangible
qualities of a design solution. However,
they can also be used to test and explore
intangible qualities of a design. This
method enables a focus on the user
experience and the context of use.
ff
fi
Usability Testing.
Usability testing allows us to determine
whether users understand how to use a
product, in other words, whether the
conceptual model matches the user’s
mental model (their expectations).
USER LABS
User Labs Analysis.
A/B testing is an evaluation method that
consist of testing in parallel two di erent
versions of the same product, to decide
which one is more suitable for a speci c
user need or business goal.
USER LABS
DELIVERY

Making it happen.
What’s on the horizon? Let’s look into the next

steps to make this happen.

 The Promise of Team
& Squad Models.

Partner Leadership

Core Team

Partner

Specialists &
Disruptors

Governance

High Level Time Plan

Discovery Session (Analyse)

Initial Design & Journey (Create)

User Labs (Test)

Design Sprint

Development Sprint (Daihatsu Team)

Week 1 Week 2 Week 3 Week 4 Week 5 Week 6 Week 7 Week 8 Week 9 Week 10 Week 11 Week 12 Week 13 Week 14 Week 15 Week 16 Week 17 Week 18 Week 19 Week 20

Month 1 Month 2 Month 3 Month 4 Month 5

 Responsiveness to Client.
We constantly listen to our clients’ evolving needs -
we remain flexible to changes in requirement as well
as, feature reprioritisation - and seek to value-add by
offering advisory such as impact analysis.
Why Agile?
Greater Collaboration.
We do not work in isolation. We interact with our
clients on an on-going to provide status update,
for feature clarifications; as well as, obtain
feedback in order to deliver a product that is both
fit-for-purpose and fit-for-use.
Production Ready Delivery.
We focus on delivering production ready software
at the end of every sprint in order to help our
clients’ maximise the return on their investment.
 How We Run Sprints.
The entire process kicks-off with a two (2)
weeks inception session between the
product owner and the squad to both create 2 WKS 2 WKS 2 WKS 2 WKS
and groom the product backlog
Thereafter, the squad will run sprints; each
INCEPTION 1 ST S P R I N T 2 ND S P R I N T 3 RD S P R I N T N TH S P R I N T
sprint lasts two (2) weeks with the goal of
delivering production ready software at the
end of the sprint
Kick of Sprint Plannin
Within each sprint, there are a set of Backlog Groomin Daily Stand-U
activities which provides for potential

 Sprint Revie
interactions between the Product Owner and
Squad. Sprint Retrospectiv

Additional Backlog
Grooming
f

M i r o - C o l l a b o r a t i o n W o r k s h o p

Online collaboration for creative

and technical team. Screen flow
validation and note taking
activities are done online.
Product Backlog
A great product starts with great product
management. We use the product
backlog as the single source of truth for
the whole team.
Screen ow
Screenflow focuses on the way your
target audience will interact with the
product. We can handle and emphasize
all the paths our users will take and help
them reach their goals in the most
effective path possible.
fl
Thank you.

Wendy Novianto Pati Fertpolin

Managing Director Program Director
e. wendy@aleph-labs.com e. polin@aleph-labs.com
m. +62 812 1024327 m. +62 819 820103