UI/UX & Graphic Designer
ク リ エ イ テ ィ ブ デ ザ イ ナ ー
NOVIE OK TAVIANI INDONESIA JAKARTA
CONTACTS :
SCAN ME HERE
+62 812 9698 6106 NOVIECHIEL.WIXSITE.COM/ PORTFOLIO
P O R T F O L I O
I N T R O
D U C T I O N
ABOUT NOVIE CHIEL
In 2017, I had the opportunity to become part of DETEGO’s team in designing a Minister of Home Affairs (Kementerian Dalam Negeri) report that would be reported to our President Jokowi. I have done a lot of works with some pretty well-known clients, like; Astra, AXA Insurance, AXA MAGI, Prudential, Sampoerna Land, Bank BTN, Aqua Danone, Bank BRI, Bank BTN, Bank Mega, Kimia Farma, ViewSonic, and Adaro. I am aware of the development of design in the digital industry. Therefore, I also study and work with UI UX field as an addition to my expertise, my last experience in Sociolla as UI UX Designer. And my first time as an UI UX and Team Lead Creative for Cari Aja, a platform company that cooperates with Telkom Indonesia. One of my work (my thesis), is choosen as one of the fourteen exhibitors that selected from out of one hundred thirty five people. As one of the fourteen choosen, they giving me a chance to show my work at Qubicle Art Center, Book Exhibiton. ABOUT NOVIE CHIEL
My greatest expertise are brand identity, UI UX, and editorial layout. My pleasure is combining my experience and knowledge for giving the best creativity for my clients.
Based as a graphic designer who expertise at branding and graphic design, now as a UI UX Designer who is still growing. Novie Oktaviani is the main name. Chiel is nickname. Most people know me as NOVIE CHIEL.
NOVIE CHIEL OKTAVIANI
NOVIE OKTAVIANI JAK ARTA, INDONESIA 14 OCTOBER 1994
UNIV BUNDA MULIA DESIGN COMM. VISUAL GPA: 3.33
UI UX & GRAPHIC DESIGNER
ABILITIES
GRAPHIC DESIGN
IMAGE MANIPULATIOIN
MOBILE APP UI UX
LANDING PAGE UI UX
TYPOGRAPHY
PACKAGING DESIGN
LOGO & BRANDING
EDITORIAL LAYOUT
RESEARCH & ANALYSIS
INFOGRAPHICS
LEARNING EXPERIENCE BACHELOR DEGREE
DETEGO INDONESIA
DESIGN COMMUNICATION VISUAL UNIVERSITAS BUNDA MULIA DEC 2016 | GPA: 3.22
2016 BOOK EXHIBITION AWARDS
QUBICLE ART CENTER SAMBAL KHAS NUSANTARA
SR. DESIGNER | MAR - JUN 18’ CREATIVE LEAD | MAR 19’ - NOV 19’ UI UX | JUL 18’ - NOV 19’
JR. DESIGNER | JAN - JUN 17’ SR. DESIGNER | JUL 17’ - FEB 18’
2017
UI UX | DEC 19’ ☑ CURRENTLY
2018-19
FREELANCE WORKS
FOR HOME INDUSTRY LOGO BRANDING, STATIONERY CATALOGUE, PARTY DECOR
SOFTWARE SKILLS
SOCIOLLA
CARIAJA INDONESIA
FREELANCE WORKS
FREELANCE WORKS
KOGEN CANDLE STATIONERY
INNISFREE DOC. & PHOTO EVENT: INNISFREE 2ND ANNIVERSARY
BANK BUMN BTN ANNUAL REPORT PKBL
INTEREST
VIEWSONIC FR. GRAPHIC DESIGN OCT 18’ - JUL 19’
BENERAN INDONESIA PUSAKA APPS
LANGUAGES
90% 90% 90% 90% 90% 86%
FIND ME HERE +61 812 9698 6106 NOVIECHIEL@GMAIL.COM NOVIECHIEL.WIXSITE.COM/ PORTFOLIO
INDONESIAN (NATIVE)
ENGLISH
index 02
Index
07
UI UX
10
Branding
29
Media Printing
37
Social Media
55
Others
61
CONTENT
About Novie Chiel
7
BIG DREAM BIG FRIEND 2019 This digital imaging is made based on experienced dreams.
PORTFOLIO
Illustrate that we are a small entity and out there many things we do not know, strange, but real.
01_
UI UX - MOBILE APP & LANDING PAGE
Research. User. Interface. Design. Creation. Prototype.
UI UX
MOBILE APP Sociolla ZENIUS Education CARIAJA Indonesia Beneran Indonesia: PUSAKA LANDING PAGE ViewSonic BRANDZTORY
9 PORTFOLIO
UI/ UX
Flash Sale Additional services at Sociolla where registered users at Sociolla can enjoy the rights and privileges of existing product discounts. Live Product Carousel 14:00
NOW LIVE
Company
18:00
20:00
30%
30%
30%
30%
SOCIOLLA
SOLD OUT
Industry
BEAUTY E COMMERCE
ENDED IN: 0 5
Tools
4
2
8
LANEIGE
LANEIGE
LANEIGE
Intense Matte...
SENKA All Clear…
SENKA All Clear…
SENKA All Clear…
Rp 185.000
Rp 185.000
Rp 185.000
Rp 185.000
Rp 100.000
Rp 100.000
Rp 100.000
(1.2k)
(1.2k)
Rp 100.000 (1.2k)
(1.2k)
Segera habis
Masih tersedia
Tersedia dalam harga normal
LANEIGE
LANEIGE
LANEIGE
LANEIGE
Intense Matte...
SENKA All Clear…
SENKA All Clear…
SENKA All Clear…
(1.2k)
(1.2k)
(1.2k)
Tersisa 15
SEE ALL
SKETCH & INVISION Flash Sale Placement
1
LANEIGE
Soon Product Carousel 14:00
N E X T AT
18:00
(1.2k)
STARTING IN: 0 5
1
4
20:00
2
8 PRICE COMING SOON
PRICE COMING SOON
PRICE COMING SOON
SEE ALL
Research Revamping design for Sociolla that will help improve user engagement and more informative sale. Outcome A revamped user interface beauty flash sale. Information Flow
PRICE COMING SOON
Live Product Grid
Soon Product Grid
moncath
9:41 AM
Back
Flash Sale
ENDS IN
0
1
35%
2
100%
U
3
4
moncath
9:41 AM
Back
Flash Sale
STARTING IN
5
0
1
100%
U
2
3
4
5
35%
UI UX
FLASHSALE SOLD OUT
LANEIGE
LANEIGE
LANEIGE
Instant Facelift Pink
Instant Facelift Pink
Instant Facelift Pink
Rp 185.000
Instant Facelift Pink
(234)
Rp 185.000
Rp 100.000
LANEIGE
(234)
Rp 100.000 (234)
(234) Tersedia dalam harga normal
Segera habis ADD TO BAG
PRICE COMING SOON
PRICE COMING SOON
ADD TO BAG
35%
35%
11
LANEIGE
LANEIGE
LANEIGE
LANEIGE
Instant Facelift Pink
Instant Facelift Pink
Instant Facelift Pink
Instant Facelift Pink
Rp 185.000
Rp 185.000
Rp 100.000
Rp 100.000
IF Scrolled
(234)
(234)
(234)
9:41 AM
moncath
35%15 Tersisa
35% Masih tersedia
Back
Flash Sale
ADD TO BAG
ENDS IN
0
1
100%
U
A D D TFOL A BS AH GS A L E SOLD OUT
2
3
4
PRICE COMING SOON
LANEIGE
LANEIGE
Instant Facelift Pink
Instant Facelift Pink
Rp 185.000
Rp 185.000
LANEIGE
LANEIGE
Rp 100.000 (234)
(234)
LANEIGE
LANEIGE
Instant SegeraFacelift habis Pink
Tersedia dalam harga normal Instant Facelift Pink
Rp 185.000
Rp 185.000 BAG
(234)
ADD TO Rp 100.000
BAG
(234)
Instant Facelift Pink (234)
Instant Facelift Pink (234)
PORTFOLIO
35%
ADD TO Rp 100.000
PRICE COMING SOON
5
35%
Rp 100.000
(234)
UI/ UX
Company
ZENIUS EDUCATION Industry
E-LEARNING Tools
SKETCH
Problem Statement
The Solving
1. Users cannot immediately search 2. Inconsistent margins, buttons, fonts and icons 3. Why putting “Kamu mau belajar apa hari ini?” IF there’s no function 4. Confusing section or copywriting 5. Users have trouble finding the “Penanda” page 6. Resume learning section can be more efficient 7. Live online class comment section should be disabled after the class is not LIVE anymore, and prevent chat spam
1. Revamp the ‘search’ navigation menu into a more efficient and useful menu in the home page. 2. Restructuring the design system for more consistency 3. Put “Kamu mau belajar apa hari ini?” into search bar 4. Revamping the section and copywriting 5. Put “Penanda” page into the navbar and revamp 6. Put “resume learning” into the navbar and revamp 7. Revamping the live class and the comment section a. Preventing spam chat: Have to wait 5 seconds to send a new chat b. Asking when the live class ended: Disabled comment section and provide a link that will go directly to the youtube comment section c. Store the previous video for easy find to user and notification for live class and notification
Comparison OLD
NEW
UI UX
13 PORTFOLIO
OLD
NEW
OLD ZENIUS LIVE CLASS
NEW ZENIUS LIVE CLASS
UI UX
NEW ZENIUS LIVE CLASS
15 PORTFOLIO
NEW PAGE SECTION - PENANDA (SAVED)
NEW PAGE SECTION - LANJUTK AN
BOTTOM NAVIGATION BAR OLD
NEW
UI UX
COLOR PALETTE
17 PORTFOLIO
UI/ UX Company
CARIAJA INDONESIA Industry
SMART TRAVEL APP Tools
ADOBE XD & ZEPLIN
UI UX
19
PORTFOLIO
CARI AJA Creative, passionate and dedicated experts focused and take pride in creating an app that serve people need, informative, connecting, engaging and adding value.
Research Conceptualize and design a new feature for CariAja that will help improve user engagement and retention by expanding social capabilities and activities. Also developing a sustainable business. Outcome A reimagined CariAja site for CariAja’s mobile app that allows users to build the needs for searching place accurately by using pin point map and exact official information about the place which provides an effective way to enhance their needs while increases CariAja product usage. Ideation Process • How might we help users to build searching habits in an efficient way? • How might we allow users to explore more place they will be interested? • How might we provide a more anjoyable searching experience for users? Information Flow
Visual Design
Primary colors #EE422F
#253A7B
#FDDF00
Circular Std
UI UX
Typography
Book SemiboldBold Black Bold Italic Icons
21 PORTFOLIO
+
+
UI/ UX Company
BENERAN INDONESIA FOUNDATION
UI UX
Industry
Tools
ADOBE XD & ZEPLIN
23 PORTFOLIO
UI/ UX Company
VIEWSONIC (INTER) Industry
COMPUTER HARDWARE Tools
PHOTOSHOP & ADOBE XD
+
UI UX
25
PORTFOLIO
+
UI/ UX
Company
BRANDZTORY Industry
MARKETING SUPPORT AGENCY Tools
ADOBE XD & ZEPLIN
UI UX
27 PORTFOLIO
02_
BRANDING IDENTITY
Brand. Logo. Tagline. Identity. Name. Message.
PRINTING
BRANDING BRANDZTORY LOGO Pusaka STATIONARY Zerolatency
29 PORTFOLIO
Branding Company
BRANDZTORY Industry
MARKETING SUPPORT AGENCY Tools
AI, PS & ID
PRINTING
31
PORTFOLIO
Logo Company
BENERAN INDONESIA Industry
FOUNDATION Tools
AI
+
PUSAKA
=
LOGO PHILOSOPHY Keris is a traditional dagger weapon of Indonesia which has now become one of the heirlooms for Indonesian Therefore, kris represents the true value of Indonesia in realizing “heirloom weapons” to protect and fight against negative things that have begun to undermine the nation’s future successors.
Stationary Company
ZEROLATENCY Industry
STREAMING SERVICE Tools
AI
03_ MEDIA PRINTING
Book. Magazine. Layouting. Calendar. Infographic. Combining.
LAYOUTING Sustainability Report PT Tirta Investama (DANONE AQUA)
PRINTING
INFOGRAPHIC Laporan Kementrian Dalam Negri 2017
FULL BUILT Laporan PKBL Bank BTN Prudential Top Achiever 2016 Prudential Auckland 2017 Sampoerna Annual Report 2016 CALENDAR AXA MAGI 2017 Kimia Farma 2018 37
BROCHURE Baby Kalasan Gift Voucher CariAja Indonesia Claim as Owner PACKAGING Pasteliciouz
WHAT IS FULL BUILT MEANS?
PORTFOLIO
It means the designer made all the works from the scratch. From the idea, sketching, vector, icon, digital imaging, layouting till Final Artwork. Enjoy :)
Infographic Title
ANNUAL REPORT FOR PRESIDENT JOKOWI 2018 Company
MINISTER OF HOME AFFAIRS /KEMENTRIAN DALAM NEGRI Industry
GOVERNMENT Tools
AI
PRINTING
39
PORTFOLIO
Layouting Title
MENYEBAR KEBAIK AN UNTUK INDONESIA - SR 2018 Company
AQUA DANONE Industry
MINERAL WATER Tools
PSD, AI & ID
COVER
AQUA wants to sp Indonesia. Repres mountains, reside and recyling activ
Also, car visual in represent the spre with AQUA produc
PRINTING
pread goodness for sented by visual ents, solar panels vities.
the cover ead of goodness cts
41
LAYOUTING & INFOGRAPHIC AQUA has a clean brand, therefore the book layouts with a modern and clean style.
PORTFOLIO
The infographic style follows the cover design. With bright colors to familiarize readers with AQUA
Full Built Title
SINERGI UNTUK MEMBANGUN MASYARAK AT NEGERI YANG BERKELANJUTAN - PKBL 2017 Company
BANK BTN (BUMN) Industry
BANKING Tools
PSD, AI & ID
+
PRINTING
+ 43
Title
PRUDENTIAL AUCKLAND 2018 Company
PRUDENTIAL INSURANCE Tools
PSD, AI & ID
PORTFOLIO
Industry
+ +
Full Built Title
PRUDENTIAL TOP ACHIEVER 2017 Company
PRUDENTIAL Industry
INSURANCE Tools
PRINTING
PSD, AI & ID
45 PORTFOLIO
+
Full Built Title
DELIVERING REAL VALUE - AR 16’ Company
SAMPOERNA Industry
HOLDING COMPANY Tools
PSD, AI & ID
+
Calendar Company
AXA MAGI Industry
INSURANCE Tools
PSD, AI & ID
PRINTING
+ CONCEPT The idea of the shape in illustration was based on Indonesia’s island. That represent AXA MAGI vision for protecting entire Indonesian thoroughly with their superior insurance products.
47 PORTFOLIO
+
Calendar Company
KIMIA FARMA Industry
MEDICINE Tools
AI & ID
+
+
PRINTING
49
+
Company
KALASAN BABY Industry
FOOD & BEVERAGE Tools
PS, AI & ID
+
PORTFOLIO
Brochure
Brochure Company
CARIAJA INDONESIA Industry
SMART TRAVEL APP Tools
AI & ID
+
PRINTING
51
PORTFOLIO
+
+
Packaging Company
PASTELICIOUZ Industry
FOOD & BEVERAGE PRINTING
Tools
PSD & AI
53
+ PORTFOLIO
04_ SOCIAL MEDIA
Engagement. Visual. Trending. Social. Content. Media.
SOCIAL
UNPUBLISHED VOYAGER QY PUBLISHED VIEWSONIC ID
55 PORTFOLIO
Social Media Company
VOYAGER Industry
TRAVEL Tools
AI & ID Phase
UNPUBLISHED
Posting tips and trick, guide and quotes
SOCIAL
57
Helping the user get the best engagement!
PORTFOLIO
Company
QY
Industry
FURNITURE Phase
UNPUBLISHED Furniture
Soc Me
SOCIAL
cial edia 59
Company
VIEWSONIC ID Industry
Phase
PUBLISHED
PORTFOLIO
COMPUTER HARDWARE
05_ OTHERS
Merch. Merch. Merch. Merch. Merch. Merch.
OTHERS
CLOTHES CARIAJA Indonesia TYPOGRAPHY On Pillow Totebag
61 PORTFOLIO
Merch Clothes
CARIAJA INDONESIA Totebag
PANTUN TYPOGRAPHY Pillow
QUOTE TYPOGRAPHY
+
+
OTHERS
63
PORTFOLIO
T H A N K S
C A L L M E
“LIVE IN THE LEADING— THE SPACES IN BETWEEN THE RULES.” -STEFAN MUMAW
SCAN ME HERE
+62 812 9698 6106 NOVIECHIEL.WIXSITE.COM/PORTFOLIO