Sudrajat Dhanubroto
Visual Communication Design Portfolio
9 1 0 2 6 1 0 2
preface This portfolio contains a selection of my works in Visual Communication Design. From personal projects to commercial projects throughout 2016 - 2019. From all the designs as you can see in this portfolio, there is no definedset of design style, because I want to explore many different approaches and to adjust with the brief and challenge. Without any further ado, please enjoy my design portfolio that I have made with all my heart and thank you for spending your time.
table of contents preface portfolio
/01
UI & UX - Enervon Website - Enervon Microsite - Warsaw Rekords App - MLDSpot Membership Page
/02
Visual Communication Design - Enervon C Social Media Content Design - Biogesic Social Media Content Design
/03
Editorial Design - Homonarran Lookbook
/04
Illustration - Illustration for Emerson Stone Design Agency - Other Work
/ UI & UX
ENERVON WEBSITE
Enervon is a nutritional supplement to help promote increased energy and enhance the immune system, also for the treatment of Vitamin-B complex and Vitamin-C deficiencies. Divided into two different products, Enervon-C and Enervon Active with Zinc to give more energy.
Objective : To give user news, updates and informations about Enervon through website, such as event, and articles. Also to give information about product knowledgement, the difference between Enervon-C and Enervon Active, and their efficacy.
Enervon Website
UI & UX
Hierarchy
Grid
Font Size
3
Banners
Enervon-C
Enervon Active
Cards
4
UI & UX
Enervon Website
Article Content Contain with many different kind of contents, like health, work, etc. To give user information and news about those category above. And also to show the facts about multivitamin myth busters.
5
Product Knowledgement To give information about Enervon products, Enervon-C and Enervon Active and their efficacy. Product pages has the function to help user where to buy the products through e-commerce, supermarket and minimart.
6
UI & UX
Enervon Website
7
8
UI & UX
Enervon Website
9
10
/ UI & UX
ENERVON MICROSITE
Design a microsite for Enervon’s upcoming campaign, #DariEnervonUntukKamu. #DariEnervonUntukKamu is a gesture of expressing affection through Enervon to the loved ones. Enervon will provide a package and a custom letter of appreciation for audiences who has join the campaign.
Objective : To drive user to join the campaign and bring traffic to Enervon’s Website.
Enervon Microsite
User Journey
UI & UX
User visit microsite page via Enervon’s website
User type their letter
User submit and share the letter to social media
13
enervon.co.id/darienervonuntukkamu
Custom Letter User can create their own message to their beloved ones and Enervon will send the letter to the addresse that has been inputted.
14
Enervon Microsite
UI & UX
Key Visual
Banner
15
Steps
Post-Submit
16
/ UI & UX
WARSAW REKORDS APP
This is fictional personal project I made for practice some case and sharpen my user interface design skills. Based on user behavior and case, I learnt how to turn them into user experience such as providing service with promos, easy payment method, and divided item search.
Objective : To help user search the item they want to buy and help them purchase easily through app. With app, user can use promos such as free delivery and discounted item.
UI & UX
Warsaw Rekords App
19
20
Warsaw Rekords App
01
Post Purchase Notification
UI & UX
To show users that their order is successfully procced and has been taken care of for delivery. User can check their order via notification page.
02
Separate Item Condition Search Because the store has many different conditions items, the app divided them which item is new, pre-loved and also pre-order.
21
03
Separate Item Type In Check Out This will help user to re-check which item is pre-loved or new before continuing to payment. To prevent some misunderstanding the item’s condition.
04
Post Transaction Notification User can check which items that already on delivery or re-check which items they had already purchased.
22
Warsaw Rekords App
Discounted Items Change Weekly UI & UX
The store provide promos and deals via app to gain more users and traffic. The Weekly Deals change every week so user can get the deals from their favourite artist and other artist.
23
Easy Payment Method Provide many forms of payment method mostly via digital banking for easy-use single tap purchase.
24
UI & UX
Warsaw Rekords App
25
26
/ UI & UX
MLD SPOT MEMBERSHIP PAGE
This is a get and redeem points for prize program from MLD Spot. The main journey is audience only do some activities such as reading an article, share article, etc in MLD Spot website.
Objective : Designing membership page for the program, it’s a personal profile for users. User can check their point, point history, list of activities to get point and prize item list for redeem.
MLD Spot Membership Page
User Journey
UI & UX
Login / Register
Collect Points (read and share articles, login per day, attend MLDSpot event, etc.)
Redeem Points
29
mldspot.com
Complete everything to get points User can get point from the following activites such as completing profile, reading an article, attend MLD event, etc. When they recieved the points, MLD will send the notification and later they can check them in history.
30
UI & UX
MLD Spot Membership Page
Scan to get points User also can get point from off-line activities. Attending to MLD event and scan barcode from their stand and scan MLD product they brought.
31
mldspot.com
mldspot.com
32
UI & UX
MLD Spot Membership Page
33
34
/ Graphic Design
ENERVON-C SOCIAL MEDIA CONTENT DESIGN
Enervon is a nutritional supplement to help promote increased energy and enhance the immune system, also for the treatment of Vitamin-B complex and Vitamin-C deficiencies. Divided into two different products, Enervon-C and Enervon Active with Zinc to give more energy.
Objective : To give awareness about the brand through Facebook and Instagram. Designing content about information, tips, facts about health, work life balance and finance.
Graphic Design
Enervon-C Social Media Content Design
Facebook & Instagram Content
Objective : Designing social media content about tips and facts about health, carrier, and finance. Communicate the information of the content through visual.
37
Digital Activity
Objective : Reach more audience with giveaway items through many kind of digital activity such as photo contest, posting Enervon GIF, etc.
38
Graphic Design
Enervon-C Social Media Content Design
#DemiKeluarga Digital Campaign
Objective : To give awareness that Enervon-C is always there for those who contribute more for their family no matter how the circumstances, Enervon-C will provide for those who reliable one for their family.
39
SI DATUN Campaign
Objective : From phrase “Daya Tahan Tubuh Menurun” is campaign during ramadhan. To inform the audience about every symptoms that can vitiate our immune system. Enervon-C will prevent those “DATUN” symptoms, especially in ramadhan, for those who’s fasting while working.
40
/ Graphic Design
BIOGESIC SOCIAL MEDIA CONTENT DESIGN
Biogesic is a paracetamol medicine to ease various type of pain like, headache, tootacBiogesic is a paracetamol to ease various he, PMS, and also effective to heal fever. The type of pain such as headache, tootache, target market is of millenials mom to average PMS, and also effective to heal fever. The mom. Biogesic is labled for family, so whentarget market is for millenials mom to averever there’s a family member got sick, mom age mom. Biogesic is a medicine for family. has always known Biogesic is the medicine.
Objective : To give mothers awareness about Biogesic effectiviness through Facebook and Instagram and also to give acknowledement to moms that Biogesic is a medicine with 100% Paracetamol which is safe to consume for all family members.
Graphic Design
Biogesic Social Media Content Design
Facebook & Instagram Content
Objective : Designing social media content about parenting tips, health, and useful info for audience. Communicate the information of the content through visual.
43
Digital Activity
Objective : Reach more audience with giveaway items through photo contest and story telling through Instagram.
44
/ Editorial Design
HOMONARRAN LOOKBOOK
Homonarran is a group that concern to many Indonesian cultural aspects. Music, custom, places, and art. Their objective is to bring awareness to people that Indonesia still has many little details of culture. And Homonarran try to communicate them as a story teller. They capture the moment and share them to audience in photography, art and other media.
Objective : To introduce Homonarran and their objective. To show the audience about what’s going on in Bali and also small things in Bali that they might missed through photography book.
Editorial Design
Homonarran Lookbook
47
48
Editorial Design
Homonarran Lookbook
49
50
Editorial Design
Homonarran Lookbook
51
52
/ Illustration
ILLUSTRATION FOR EMERSON STONE DESIGN AGENCY
Emersone Stone is a design agency based in Colorado. Creating some illustrations for two different projects, one for their product and the other for a website for their client.
Objective : To communicate the product through illustrations to user so they can easily understand the message.
Illustration
Illustration for Emerson Stone Design Agency
Illustration For Website
55
Illustration For Product
56
/ Illustration
ILLUSTRATION WORK
Some of my illustration works executed with many variant of style. I intend to explore the illustration style with matching the main communication and objective. Some of them are personal works because I’d love to explore more styles and scales.
Illustration
Illustration Work
Enervon-C 2019 Calendar
59
60
Illustration
Illustration Work
Enervon-C & Enervon Active Instagram Sticker
61
Greeting Card
62
Illustration
Illustration Work
Homonarran UI & Illustration
63
Personal Illustration Project
64
Illustration
Illustration Work
65
66
Illustration
Illustration Work
Icon Illustration Practice
67
On Boarding App Practice
68
u o y k n a th