BDM10014 VISUAL COMMUNICATION THEORY AND PRACTICECREATIVE INTERACTIVE FLIP BOOKVisual Communication Analysis of Daily Culture & GrabFood Digital ProductNAME:MUHAMAD DANIEL ADAM BIN ASMAWIMATRIX NO:09BDM26F3025LECTURER:Pn. KHATIJAH BINTI MOHAMMAD SAAD
1. Introduction & Case Study OverviewWhat Is Visual Communication? Conveys messages through icons, grid layouts, color schemes, and digital typography. Why Is It Important? Uses corporate green (`#00B14F`), intuitive icons, and clean UI to build a super-app ecosystem. Guides app user navigation, establishes trust, and accelerates daily transactional speed. Case Study: Grab App
2. The Visual Communication Process 1. SENDER 2. MESSAGE 3. MEDIUM 4. RECEIVER Grab Management Brand identity & product teams Service Accessibility Convenience, safety Mobile Interface App Users iOS & Android Grab SuperApp UI Consumers placing food orders
3. Roles: Client, Designer, and Audience The Client Grab Executives driving conversions, promos, and brand consistency across regions. The Designer UI/UX Designers structuring grid hierarchy, micro-interactions, and visual order. The Audience Daily commuters and hungry users seeking quick visual feedback and seamless booking.
Stakeholder Main Priority Possible Conflict Scenario Client (Grab) Maximize promotional ads & partner visibility Pushes for more banner placements that clutter screen area. UI/UX Designer Minimalist layout & visual hierarchy Wants clean whitespace to reduce user cognitive overload. Audience (Users) Instant service discovery & fast ordering Gets frustrated by pop-up ads obscuring main service icons. 4. Stakeholder Conflicts & Solutions
5. Semiotics: Understanding Visual Signs Sign 01 Corporate Green Theme Symbolizes eco-trust, safety, and freshness across Southeast Asia. Sign 02 Food / Bike Service Icons Iconic representations communicating instant function without words. Sign 03 Live GPS Map Interface Indexical sign indicating real-time order movement and ETA.
6. Functional Features of the Grab InterfaceService Grid LayoutSymmetrical tile structure facilitating quick finger tapping.Search Bar & FiltersProminent placement allowing instant food discovery.GrabPay Balance WidgetProvides immediate financial visual status at the top header.
7. Semiotics vs. FunctionalitySEMIOTICSMain Concern: MeaningBrand loyalty, trustworthy green hues, and intuitive icon symbolism conveying effortless speed.FUNCTIONALITYMain Concern: Practical UseOne-tap order checkout, low touch latency, legible font sizes, and accurate live driver location map.
8. Sensing, Selecting and Perceiving 1. SENSING Retina registers the vibrant green top banner and colorful food thumbnail grid. 2. SELECTING User isolates the 'Food' icon or promo banner when driven by hunger cues. 3. PERCEIVING Mind connects visuals with past seamless ordering memories and confirms payment.
9. Academic Research ReferencesHuxley, A. (1942). The art of seeing. Harper & Brothers.Explains digital affordances where app icons naturally invite finger tap interactions.Lau, C. H., Tan, K. W., & Lim, S. Y. (2021). SuperApp UI perception in Southeast Asia: Color theory and brand trust in mobile interfaces. Journal of Digital Media & Interaction, 4(2), 45–58.Demonstrates Grab's green palette significantly elevates user trust and security perceptions.Norman, D. A. (2013). The design of everyday things (Revised and expanded ed.). Basic Books.Provides the Sensing, Selecting, Perceiving framework for evaluating mobile digital interfaces.
10. Summary Conclusion This flip book centers around the theme of "Family, Food Technology, and Urban Culture," positioning the GrabFood digital platform as a modern visual communication medium. The visual mood is designed to feel vibrant, modern, and clean, combining Grab’s corporate green hue with commercial food photography that stimulates appetite. The layout adopts clear visual hierarchy principles where primary headers and action buttons take precedence to streamline user navigation. Interactivity within the flip book is enhanced through virtual page turns and graphic annotation callouts detailing specific design choices. Through this structured approach, audience members can observe how core visual communication theories specifically semiotics and cognitive perception processes are effectively applied within everyday digital user experiences.
