Camille Blogs a Bit

Writing about design, technology, maybe philosophy, and daily living (in Singapore)

Menu Close

Category: Design (page 2 of 7)

Branding workshop with Orange Hive

I attended a branding workshop today. Which might be weird because I should’ve learned about it in college, having graduated from a design course. But the workshop made me realize how outdated my course a few years back was because this time we didn’t just dive into type and colors and logos, trying to find an evasive muse from the land of nowhere.

It was only a few hours, but we went step by step to really think about what your brand is and who your customers are. This is important as a solid, starting ground that you can use as reference when deciding the visual aspect of branding. We had to think about our customers through personas. We had to come up with what our brand wants to communicate, how we want to make our customers feel and what we want to make them do at various touch points with the brand.

It was a good refresher workshop also because it reminded me of important points that I might have missed whenever thinking of branding. The structure of the workshop served as a guide — like a template you can start with when you feel lost, but something which you can definitely tweak based on how you think best. Sharing what we’ve written down with people in a group also made me realize that I have to work harder in being articulate because it’s challenging to describe some ideas I have in mind.

It was great; I had fun and met new people and learned about some points that I forget to consider when doing branding. I’m definitely looking forward to more workshops from Orange Hive. Much thanks to the awesome folks who held the workshop: Trech, Aishy, Kelvin, Hanyang, and Angela!

Patterns: what I learned from watching COSMOS and Captain America

This week has been a great week for shows and movies. First, Charlie shared with me COSMOS Episode 3. Second, I watched Captain America: The Winter Soldier with folks from work. Both of which were great shows from which I got a few things about design patterns.

A few hours ago, I just watched Captain America: The Winter Soldier (it was amazing) and immediately discussed the movie with Charlie on the way home. He said, one of the things he liked most were the ‘beats‘ for the action sequences. The action parts of the movie were very well done (and edited) and he was explaining to me how well the beats and timing in the action sequences were done.

Taking from Wikipedia:

Beats are specific, measured, and spaced to create a pace that moves the progress of the story forward.

Maybe I’m pushing it, but I think our experiences with products, apps or games, also have pacing or beats. One possible example could be from the first-time use and transforming these customers to pro-users. Since products also have stories, the pace in which they have to take one step to another is important. Maybe this is just something for me to think more about since I can’t come up with quick examples right now.

Meanwhile, in COSMOS I learned that humans absolutely love finding patterns in everything to the point that we try to see patterns when there really is none. Patterns, while useful for studying things like nature and people, can be used to create beliefs that have no real substance. In the episode, they use the Chinese astronomers’ beliefs and observations as an example. They meticulously recorded the number of tails of comets and attached meaning. Based on the number of tails (one, two, three, etc.), they would determine if it meant famine, death of an emperor, or some other omen. Of course now we’ve proven that there’s no relationship between tails observed and events that happened after.

As a designer, observation is very important in the process of creating products and services. Maybe there are times that we looked for patterns in the wrong places, therefore possibly making errors in our conclusions or design decisions. It’s a reminder that maybe there are times wherein we  might just be seeing patterns when there really is none.  

DFA Megamall Service Design Suggestions

Banking, transferring or withdrawing money, government agencies such as visa’s, passports, driver’s licenses, among other things are all examples of ‘services’. The experiences we have from these services, whether we’re happy after a transaction or not, is an effect of how much ‘design’ is part of the process. Sometimes it may be designed well, often times not at all. Rosenfeld media has a book about Service Design if you want to read more.

Last Tuesday, I went to the DFA in SM Megamall to get my passport renewed. My first impression of the place was: this place had some design thinking involved! The layout of the room was designed to accommodate each step one by one (and in a logical order. I wasn’t going around in circles; I entered through one door and walked from step to step and exited through another). It didn’t feel like they just got a huge floor and set up tables and counters for the process; it seemed like each section was put there purposely because it sped up the process. It wasn’t perfect, but it was a good start compared to other government offices. There were just a few things about the design of the experience (or place) that I would recommend optimizing or tweaking a bit.

Problem 1: Confusing Step 1

I noticed that most customers feel confused about the “Verification” process (which is step 1). Some stand idly or are able to get a waiting number first before going to the Verification counter (there was no line to follow at that time so the step wasn’t obvious). Later on, the steps are easier to identify and the flow becomes smoother. It doesn’t help that Verification counter is at your right after entering and what’s in front is the ticket machine (so it seems like I should get a number first).  I’m guessing the entrance is at the left door because the right door is a bit hidden from the staircase going up the office, or that the “U” line starts at the left-side of the door.


A better placement for the Step 1 sign (something clearer or more eye-catching). Another quick solution would be to move the entrance to the right side door instead of the left, so that you are forced to pass by Verification first, before getting a waiting ticket/number (although I can’t verify if this has any repercussions on the waiting line on other days or hours, since I was there on a weekday morning. But this is a placement that makes the Verification counter more obvious from inside).


Problem 2: Too many numbers on the screen

After submitting your papers (Step 2) and paying (Step 3), I went straight to the Encoding Room, which is another spacious room with rows of chairs for waiting. Basically, this is where they’ll take your photo, get your digital finger prints and will ask you to confirm that you have correct information.

Before you get called to complete Step 4 though, you will have to wait for your number (the one you got after Verification, the same one from Step 2) to flash on the TV screen. This is where the confusion happens though, because the screen looks something like this:


There are a whole bunch of tinier numbers on the lower left, and a few rows of larger numbers on the right. The left side is listed with ticket numbers in red (which seems to be the counter number), and at the same time, the ticket numbers on the right side are also assigned counter numbers (in white).

For the 30+ mins that I was sitting there, at least two people asked me what to do or which numbers to look at. At first, I was feeling confident that I was waiting for my number to show up on the right side of the screen. In my mind, I thought I could vaguely recognize the people ahead of my number and it seemed like they matched the tickets being currently served. But then, one of the people who asked me pointed out that the smaller numbers on the lower left were also updating (and they were showing my number as well as other numbers, while the right side only showed numbers that were before mine). This made me doubt myself. Did I make the mistake of waiting for the wrong side of the screen to update? Did I miss my chance?

I started to get nervous, but I reassured the stranger that it’s the right side that was updating and is the one we’re supposed to watch for. I wasn’t as confident as I first was though, but soon enough I proved to be right. But not without some nervousness!


They should show only the numbers/counters in the Encoding Room. The lower left numbers showed all the counters (even when they weren’t being manned by a person, or even from the other room which is unnecessary information for the waiting customers in the Encoding Room). I could only guess that it’s an automated system that’s updating the lower left of the screen, while the bigger numbers are updated manually by whoever is behind the counter.


Problem 3: Encoding Room Counter Number Placement  

Another problem is the placement of the numbers on the dividers of the counters in the Encoding Room (Step 4). I decided to sit on the left side of the room where the numbers on the dividers of the counters are visible, but the room was wide enough that half its occupants wouldn’t be so lucky. I observed a lady whose number flashed on screen and she had to walk from the right side of the room to find which counter corresponded to her ticket, before she hurried towards the counter on the middle of the room.



This is the easiest to solve: both sides of the dividers should have numbers.


Final Thoughts

The problems and suggestions I shared on this post didn’t really cover the whole process (from booking an appointment online to doing the steps at the office). I only talked about the experience inside DFA Megamall. Maybe next time I’ll review it from start to finish, but I just had those doodles sitting on a draft for too long that I wanted to write and publish this before I get too lazy to. Here’s a quick list of my experience from the online process:

  • When I first booked an appointment, I did so before I traveled to HK. I haven’t renewed a passport before (the one I got five years ago was my first), and I didn’t know if I could or couldn’t use my old passport once I applied for a renewal. I had to google before my flight to see what they do exactly, because it wasn’t clear from the website. They had warnings at the door at the DFA office that they’re not liable if flights are affected because of passport processing time.  They never explain what happens to your old passport though.
  • You can cancel an appointment online 5 days or more before your scheduled appointment. I was canceling at the last minute so I was rejected by the system. However, booking a new appointment automatically cancels your old appointment. So I did that instead. This negates the 5-day minimum requirement.
  • They are wasting paper by making us print the first page (has the schedule and checklist) and last page (fine print) of the PDF file sent after booking. At the verification counter, they are taken off and, I assume, later thrown away.

The whole process was faster compared to some offices (I was there two hours only because I went too early, at around 10am, but I was scheduled for 11am so they didn’t let me in until 45 mins later). There was a line at 10am but when I went in again after 10.30am, it has more or less disappeared. Despite the few confusing aspects of the service, it was still orderly and whatever confusion customers had, most people finished the process without much trouble (based on my observations on how many people ask questions or walk around confused).

It’s been five years since I visited the main DFA office and this was a better experience for me. I’ve seen more malls opening DFA offices and it seems like a better idea to go to these offices rather than the main office. Getting my driver’s license in…Cainta, (or Marikina; I can’t remember) was slower and grimier compared to the cleaner License Renewal office in Megamall. In my experience though, not all government services in malls are equal in efficiency. For example, my NBI Clearance experience at Robison’s Galleria was much, much better than the one in Robinson’s Metro East. It’s still best to ask around which mall or place would have the most efficient service, unless you have no choice but to go to the main government office.

UXHK 2014 notes: Storytelling – Interaction Design as the Language of Story

Workshop by: Dave Malouf, @daveixd

If your story doesn’t engage, then you are probably failing at design.


  •  people = personas
  • location = context
  • props = interfaces
  • activities = tasks
  • dialog = flow/sequence
  • experience – how we FEEL how to get things done
  • engage emotional connection with voice/tone
  • Tales with: purpose, meaning, value
  • design to create change

Why Stories?

  • Experiencing
  • What it is like to be there
  • bring story to 3D space –> experience surrounds us
  • Stories frame; they’re intentional –> conveying the future with intention
  • Suggested reading: “Understanding Comics” – deconstruction of comics/stories
  • Suggested notebook: Muji Manga Notebook
  • Games, stories, jokes: culturally embedded

Stories create Landmarks

  • What it is
  • why they’re doing something
  • “Where were you when…?” 
  • If they don’t engage emotionally, they probably won’t engage
  • Design things for the kind of emotion in a specific context when the product/interface is being used

Escape > Reflect

  • Create a story that will allow me to understand myself

How do you create a story from scratch?

  1. Experience
  2. Hard Work
  3. Find your Voice
  4. Research

Actual experience is better: engage in the research!


  • cluster of users -> similar behavioral patterns
  • behaviors, attitudes, motivations are similar regardless of age, etc.
  • Observe as much as you can
  • Primary: direct target
  • Secondary: will impact the primary persona
  • Tertiary: not going to use it but are impacted by the system
  • example of facets: lifestyle, relationships, entertainment, technology uses, goals, motivations
  • be specific – humanize them
  1. Get writing – words for your process
  2. Get moving – improv: influence from the audience
    suggested reading: Game Storming
  3. Build it
    interactions, especially in mobile, are embodied (physicality + digital experience)
    for example: figuring out the right gestures (i.e. inserting a card or swiping – systems might not translate exactly the same way around the world)

Suggested reading: “See What I Mean” by Kevin Ching

Know Other Disciplines

  • Realism
  • Resonance – I can believe in your story and I can connect it with my life
  • interest – the way you tell your story
  • drama – key in on their motivations
  • tell it in a way that engages them
  • design serves that create feedback (empowering people)

Everything has a story

  • stories help us become preventive instead of responsive


From Story to Design


Externalize and reflect culture

  • find commonalities
  • navigate
  • cross-cultures

Stories frame Principles (how you describe your product/service)

  • not guidelines or patterns
  • qualities to make you different

Introduction to Parti Sandwich

Parti – central idea or concepts of a building

  1. Tech Opportunity
  2. Human Factor
  3. Marketing Trend
  4. Target group’s activities
  5. Scenario

Some guide questions: 

  • Did your persona stand up? or does the story map against the persona?
  • Are the activities complete enough?
  • Does the end of your story have a realistic happy ending?

Your Character

  • Backstory
  • Motivation
  • End Goal
  • Personality
  • Interests
  • Relationships


  • enough explanation
  • problem framed to engage
  • problem well described
  • resolved realistically
  • clear vision of the future


  • artifacts
  • space
  • roles
  • expectations
  • culture


From Words to User Interface


Encode your UI

  • chunk into scenes
  • add nouns and  verbs into place: objects, methods, parameters
  • adjust screens based on appropriate density



creating a vision together

  • Collaborate – include people in the research
  • Come up with personas from data


UXHK 2014 notes: From Customer Insight to Great Products

Root Cause Analysis

  • the first answer might not be the right answer –> DIG DEEPER
  • WHY is that our problem?
  • 5 Why’s: Problem – Why – Why – Why – Why – Why – Solution
  • one branch at a time, like a mind map
  • Rethink how you’re facing the problem
  • We are often NOT the average consumer
  • to find it: go out and talk to people –> Thinking tool –> VALIDATE!
  • Research: explore problems
  • BUT! It’s not going to be perfect
  • Hypotheses: test
  • If a solution has a minor cost and relatively high success, then why not try that out?


Innovation Clover


  • User Needs: unmet needs, improved experience
  • Money/profit: high revenue, low costs
  • Business: brand and strategy alignment, skill sets/expertise, resources (human and financial); cost of doing something: what product can we NOT do to invest in ONE thing
  • Technology: new capabilities, technical debt (every time we cut a corner, we can hinder design or meeting customer needs; keeping up with technology)


  • find the partner you need to be successful
  • you don’t have to do everything
  • WHAT do I have?
  • WHAT am I missing?
  • Partnerships –> Re-evaluate –> What do we need to do next?

Business Capabilities

  • Creating capabilities
  • creating something customers love
  • Starting points can be uncomfortable
  • users may not know how to articulate what they need –> they don’t know what the solutions are
  • Design: foresee


Reaching Your Stakeholders

  • articulate what’s going on
  • Recommended Reading: “Crucial Conversations” 
  • Reframe the conversation: find the path that’s right / towards what will drive the results


Avoiding the “Me Too” Products

  • Experience Continuum




Identifying Markets for Global Research

Where should we do research? 

  • country differences are not useful
  • (a) Is the design fundamentally different?
  • (b) Data entry: is the paradigm fundamentally different?
  • (c) Are consumer behaviors fundamentally different?
  • (d) Are the countries fundamentally different in any relevant way?
  • BIGGEST DIFFERENCES, not biggest markets


Currently Reading: The User Experience Team of One

I’ve recently decided to join a team as a designer and front-end developer. We’ll be working on a product and I wanted to start off with the User Experience in mind. I bought the book, The User Experience Team of One on the Kindle app a day before UXHK (as a refresher, because I didn’t want to embarrass myself if I say things that may be incorrect when talking with other people, hehehe). I haven’t finished the whole book, but as the reviews on Amazon said, it is a good guide for those starting to integrate UX more into their products. It is general enough that you can come from any background but is specific enough to give some guidelines as to where to start.

As a designer, I have the tendency to jump right into the visuals even though I haven’t really understood the business goals or clearly identified user goals that would guide the interface design. I keep in mind UX design to an extent, but I’m not usually part of the team when planning the product (or at least the last time that I was, the company doesn’t exactly start with the UX even though it keeps some of it in mind, such as design principles for user interfaces). I attribute it to only being hired as the visual designer (and front-end developer) so I’m not really part of the planning of the product, where design decisions can be made very early on. This time though, with the new job and project I’ll be working on, I could be more active when it comes on identifying key aspects that will affect the product we want to release.

I definitely recommend the book to anyone who wants to put user experience first regardless of their role in a team (or as an individual). It really is a good starting point for designing user experiences.