The Officejet 4620 e-All-in-One is the follow on product for the Officejet J4500/4600 Series of All-in-One which I previously worked on. One of the major changes is the design of the new user interface.

I lead the design team of visual and interaction designers and worked closely with the engineers, marketeers and the rest of the program team in the definition and development of the user interface.

As the UI was being design from scratch there was much interesting work. To come up with the appropriate layout and basic interaction, I took reference from the magic frame UI which is being used in HP’s current range of products. The magic frame UI pulled out commonly used buttons (such as home, back, cancel) out from the screen and placed them in a frame around the screen allowing easy access, and increasing the real estate on the screen for other UI components. Utilizing the magic frame UI allowed HP to offer familiar user interface across the product range, an important consideration since most of our customer are loyal repeat customers. This helped to ensure that they would be able to easily use any product in the product range

Officejet 4620′s UI required some ingenuity to adapt the magic frame UI, since it was faced with some restrictions. The screen wouldn’t be a touch screen like most of the other magic frame UI. To adapt to this configuration, the UI became a hybrid of the magic frame and atm style interface. The row of buttons on the left provided familiar premises of magic frame, while the row of buttons on the right would activate the option shown on screen.

After the basic UI foundation was decided. We set about auditing the feature list and creating screens for all unique interaction. The visual style guide also had to be defined. As this is a newly created UI, we knew that we should get in a round of early testing before the interaction style was fixed. The research was conducted in USA, Germany and China as the products would be shipped worldwide. We learned a lot from the study and corrected design flaws, before moving onto the detailed design.

As an idealist, there is always room for improvement in any design that I’ve worked on and that is true also for this design (higher resolution and better graphics next time!). Regardless, I am glad to see this product on the market replacing the 1 line UI from the earlier product range and that it would provide users with better user experience.

Screens from the 4.3″ display.

Screens from 2.4″ display.

Below is a sample of the workflows from the device.

Back then in 2008, the human factors team in HP Singapore was still pretty young and as HP is a engineering based firm, there was much work to be done to establish ourselves and to get our voices heard. This project was hence started as a pilot study to better understand our users in a multi-faceted manner which would aid us in building credibility in the company as well as allow us to provide better design for our users having seen the world through their eyes. A framework around understanding our users in totality was constructed and this was the guiding framework for the research around which we gathered data.

This study was planned to be a longitudinal ethnography research, where there was a mix of contextual inquiry, placement study and  diary study. The study was conducted over 4 weeks with 11 customers and there were 4 phases in the research.

In Phase 1. We initiated contact with the customers and started to understand their business, their printing needs, their current all-in-one usage. We spent 1-2 hours being “A fly on the wall” as well, observing the happenings in the customer’s natural environment. We placed a journal with the customers in which they were asked to enter in their typical printing tasks workflow.

In Phase 2. We replaced their existing all-in-one with a model under development to start understanding how this new model affects their print ecosystem.

In Phase 3. We continued the study with weekly visits and observation sessions. During the sessions we would follow up on their usage with the new model as well as entries in the journal.

In phase 4. We concluded the study and started synthesizing data collected from the study.

From the data that was collected, I generated various frameworks to guide in future product design. A draft persona was also created. (*text in the results is blurred for confidentiality). The study results were shared with the Research and Development department and the senior management and were very well received. It helped the engineers to understand the customer better and to empathize more with issues they face with the All-in-One printer usage. The study results also helped to push forth several improvements in the products such as simplified menus to allow for quick completion of key tasks, focus on improving ecosystem around printers to enhance holistic user experience, With the success of the pilot run, the management agreed to sponsor a worldwide research in US, Europe and Asia which allowed us to collect data from representative customers (US is the major market for the products, followed by Europe. Singapore is a very small market and may not be representative of the global market we serve).

The study investigated the usability of the websites from the four major cinema operators in Singapore. These four major cinema operatos are Cathay(CC), Eng Wah(EW), Golden Village (GV) and Shaw Brothers. The websites were widely used by the movie-goers in Singapore to check movie schedules, seat availability, view movie trailers and book tickets online.

The metholodgy used in this evaluation are as follows :

1. Survey conducted on 50 participants to first identify key user tasks.

2. User Test with all 4 websites on the key user tasks. Users are given the task to performed on their own and recording of the test session with Morae allowed us to evaluate the results. Results collected include navigation time, key strokes and mouse clicks required to complete tasks and Web Analysis and Measurement Inventory measuring five dimensions of customer experience : Attractiveness, control, efficiency, helpfulness and learnability,

3. Heuristic Evaluation conducted by the authors using a 5 point scale and a combined Shneriderman and Neilson Heuristics.

Based on the results, I made recommendations for design improvements.

Snapshots of the results from the study :

Comparison of Navigation Time

Comparison of Keyboard Strokes and Mouse Clicks

WAMMI Comparison of Cinema Websites

Top Usability Problems Encountered

Frequencies of Heuristic Violations Per Category

You can find the full paper here : Evaluation of Cinema Website

For my degree dissertation project, I worked on development of a simulator for Night Vision Goggle(NVG) Training. NVGs are used in  night time military operations and have increased mobility, safety and mission effectiveness. NVG training prior to usage is neccesary as it requires a sequence of actions for focusing and imagery seen through the NVG is different from daytime.  As an NVG is costly and requires a high level of maintenance and care, frequent usage of an NVG for training would shorten its lifespan and reduce cost effectiveness.and it should be used to support actual operation rather than as a training aid. To address this concern, a low cost NVG training simulator was developed to support pre-flight training.

The simulator comprises of a physical unit and a set of digitally simulated images. Adjustments required in the actual NVG are recreated on the physical simulator so that the trainee could familiarize themselves with these adjustments. The physical simulator is wirelessly connected to a computing unit and adjustments made to the objective and diopter focus ring changes the imagery that the trainee will see. These images are projected onto a screen.

In order to find out if the simulator could be an effective replacement, I had to assess the physical and performance fidelity of the simulator and the efficacy (transfer of training) afforded by digitally created NVG images.

Test 1  Physical Fidelity

To assess the physical fidelity, actual NVG photos and digitally created NVG images are placed side by side and shown to participants. Participants are asked to identify the one they feel is the photo NVG image.

Test 2 : Performance Fidelity

This test assess if digitally created NVG images provided the necessary visual cues for users to identify scenes correctly. Participants are shown two sets of images, one set of images are photo NVG images (experiment 2A) and the next set of images are simulated NVG images (experiment 2B). The participants are required to identify objects from both sets of images where the sequence of the experiments is balanced. A general linear model, repeated measures ANOVA was used to analyze the results.

Test 3 : Transfer of Training

To show the simulator could be a viable replacement, I had to verify that there is positive transfer of training. For this experiment, I split the participants into three groups. One group acted as the control group and did not have prior exposure to NVG. One group was trained using the actual NVG. One group was trained using the simulator. All three groups were then tested to identify objects with the actual NVG.

A one way ANOVA was used to analyze the results in the experiment to verify transfer of training and as shown in the following table that there is no significant difference between the performances of the groups and there is similar level of performance after different routes of training.

This dissertation was my introduction into human factors engineering and a very enlightening one at that. I gained a passion for designing better products and services suited for users and understood that we had to approach the design through multiple facets : cognitively – for intuitive usage and lower mental workload. physically – to be able to use ergonomically, without causing additional physical strain, psychologically - to satisfy users needs and wants and create meaningful products.

HP IWS Global Design Studio opened in Nov 2011 and I was involved in the studio tour given to the media (including then Minister for Information, Communications and the Arts : Mr Lui Tuck Yew). In coming up with the concept behind the tour, I wanted to give the media a glimpse of how the designers did their work and in doing so to convey the high energy permeating the atmosphere when we’re working and the immense knowledge involved in the work that we do. The media will also get a taste of  suspense as it would have seemed as if they had interrupted the designers amiss their work.

The studio tour guides the audience through the design process in HP.

At the start of a project, we would first discover what we can about our customers. This is the time when we would research about our customers and their context. We would conduct ethnography to see the customer and to listen to them. To more comprehensively understand the customer, we also conduct competitive analysis, market trend analysis, collect data from customer call centers and marketing surveys and others. The methodology for research is always customized to the needs of the project.

There is typically massive amount of information to be collected about our customers and to be able to make use of the information, we find patterns within the data and synthesize into insights about our customers. And with the insights, we brainstorm ideas in cross-functional workshop, utilizing the insights and the strengths of the varied disciplines to create the best ideas most suited to the customers. Tools we may use at this stage include personas, scenarios, customer journey map, experience attributes, design principles, and others.

Once the product has been defined, the designers start creating the product in more depth, looking at every detail of the design.

And the design will be further refined through the development cycle.

As a end to the tour, there would also be a showcase of the newest products as well as work from our collaboration with design schools in Singapore. HP designers have always been very pro-actively grooming the next generation of students and we have been working with various education institutions through collaboration projects and internship.

The studio opening was very successful and generated much press for the studio. It was gratifying to be able to showcase the studio and the good work of the designers as well.

I was a facilitator for the 4 day workshop which guides students through the 3 stages of

1. “See As”

where they observed a given environment, the objects and sights within and also interviewed people within the environment.

2. “Expressed As”

where I as the facilitator worked with the students, guiding them through various design tools such as affinity diagrams, mindmap, to gather insights from their observations and to use these insights to fuel their brainstorming, Students also sketch and prototype out their designs.

3. ”Form As”

Where designers took selected works from the students and further developed these and created finished products. An exhibition was held at *Scape to showcase these designs.

Facilitating the workshop was challenging as it required us to teach young kids the tools we use in everyday design. Their responses to the exercises, be it success or failure was a lesson learnt in how to tailor fit design workshop exercises to the audience. It was also very satisfying to see the exploration and journey the students went through as they were first exposed to design. I oversaw 3 groups of students and 1 of my group was in the final 8 designs exhibited.

Understand the design process and start by gaining empathy about users.

Layer your design providing meaningful depth.

Great design only comes about with collaboration and with understanding the point of view of the various disciplines.

*The above frameworks are adapted from existing frameworks and this posts illustrates the ones I hold closest to my heart.

Frameworks adapted from the following sources :

1. Design Process from d.school bootleg bootcamp

2. Ux Heirarchy of needs by Stephen Anderson

3. Design Thinking by Tim Brown