Take a look at my projects

Experience the way I'm thinking, doing research and creating from start to finish.
The development of the first sketches all the way untill the final product.


Ben Energie

Ben is a low-cost phone provider on the T-Mobile network. Their telecom provider called "Ben Mobiel". Ben will become besides a telecom provider also an energy supplier with the name "Ben Energie". This branche of the company is seperate from the telecom services and will go live in early 2018. During my minor Design for User Experience at the Hague University, I got the opportunity to do a project for Ben Energie with my project group.

The main goal of this project was: "Optimizing the customer journey of the switching process for Ben Energie". Read further if you'd like to know more about my approach. Or click on the image on the leftside to see the final high fidelity prototype.


The assignment: optimalization customer journey

The customer journey of the pilot version of the website Ben Energie isn't that user friendly. The goal of our assignment is to optimize the customer journey within the website and especially the switching process part. For this project we had approximately eight weeks time to do research, to create concepts, to do tests and eventually to design something great. At the end of this project we had to give a presentation at the office of Ben.


We started to ask ourselves a few questions. One of the first questions were: "what do we need to know about the company an their values?", "what kind of targetgroup are we looking at?" and "how does the targetgroup interact with the website and the switching process?" We also had to try out the pilotfase version of the website to see what kind of problems occur to us. Therefore we used an expert review method, the heuristic evaluation: the 10 heuristics of Jakob Nielsen. This helped us to get an idea of the current situation.

Our user research is based of interviews and usertests with the targetgroup. In this way we gather insights into different motivations, constraints and restraints that users experience during the customer journey. In addition to the user research we did some deskresearch as well. All the information has been analysed and put together in a "Customer Experience Journey Map". This map is a combination of the customer journey map variant and the experience map. We categorized four types of motivation. The switchers, thinkers, negotiators and the sleepers. In the image below are the building blocks of the map explained. By clicking on the image you can check out the whole customer experience journey map.


In this phase we did brainstorm sessions to explore ideas for concepts that will enhance the customer experience. We made a mindmap to collect ideas and complement each other to come up with new ideas. We then have chosen a number of concepts that will support the entire journey. I also sketched out a storyboard to visualize the process of the new flow for the customer journey. After the concept meeting with the client, we gather input to go further with the concept that has the biggest priority. To improve the customer journey we created concepts that specifically whoud fit the four types of motivation. An example is creating an attractive loyalty program for the switchers to make them stay.

Design and Testing

We discovered that there are three flows in the navigation design. The first one is called the "new customer". This type doesn't have a Ik Ben account via Ben Mobile. The second one is the "Ben Mobile customer", the system already has data from this particular type of customers. The last type is the "Ben Mobile customer via Direct Mail". The company Ben wants to approach its regular customers (of Ben Mobiel) and offer them a deal. Via an e-mail they could view their benefit and choose to switch from energy company. For the visualization of the flows we used Sketch. Below, you'll see one of the flows in detail. The other two are slightly similar but with different routes and starting points.

The homepage is a crucial starting point for the entire customer journey. Having a strong first impression is very important. The homepage must be convincing enough to have the visitor stay on the website. In addition to the impression, the homepage must also provides the visitor the information that he or she needs to continue the process. To ensure that they get their information in the right order, we did a few cardsorting sessions with the targetgroup. We asked the participants what kind of information they whould be expecting on the homepage. Then we let them build their ideal homepage of the Ben Energie website. Afterwards we asked them why they have choosen certain ways of displaying the content in that specific order. The image below shows the cards we used for the cardsorting. I really enjoy working with methods where you involve the users.

The research on the customer journey has shown that most stumbling blocks arise during the consideration and the purchase phase. This is one of the main reasons why we devised concepts for the switching process and elaborated on sketches and storyboards. These were then used, together with the navigation design, to make prototypes for a more accessible switching process. For designing the prototype we worked with the tool: Adobe Experience Design.


During this project we realized many different products. These include a hi-fi prototype, an re-design of the homepage, some marketing examples and more. To visualize all the results in a clear way, we made a booklet containing all important findings and advice. You can take a look at the advisory report by clicking on the image on the left.

The elaboration of the high fidelity prototype is very detailed and comprehensive. We tried to work out almost every possible scenario for calculating the monthly energy costs. You can try out our final version of the prototype by clicking on the image below.

Amsterdam Discovery Challenge App

During my previous internship at D-TT multimedia I worked on a project for the municipality of Amsterdam. The project is about bringing the city of Amsterdam in balance. The main capital of the Netherlands is very crowded with lots of tourists every day. City in Balance is Amsterdam's search for a new balance between growth and quality of life.

My task is to create the flow for the Amsterdam Discovery Challenge App from start to finish. The app will be a mobile solution for spreading the crowd of tourists in Amsterdam.



The assignment: Creating the flow for the Amsterdam Discovery Challenge App

The main goal is for tourists to discover more of Amsterdam than just the inner parts. By using the app they will explore other places spreaded across the city and region. The working of the app will be based on the location of the user. For using the app the user needs to activate the GPS-function on the mobile.

Research and ideation

The research part was already finished for this project. I had to deepen myself in the given information. I use this as a reference work to better empathize with the target group. The overall picture of the concept had already been sketched out as well. I had to try out a few apps to search for interaction patterns, functions and look for further inspiration.

Design and redesign

The name Amsterdam Discovery Challenge raises ideas about challenges and exploring a journey through Amsterdam. After redefining the concept, there will be three big functions in the app.

    1. Check-in points for collecting discounts (for example on drinks at a café).

    2. Challenges, these are quizzes to test the knowledge about Amsterdam.

    3. Exclusive information points, at this point the user will receive extra information in the form of audio or video.

I had written down on my colorful sticky notes what types of screens needed to be developed with the corresponding functionalities for creating the flow. Working with this method will give me quickly a clear overview of the things that I should remember to insert in the flow. Then I started sketching, cutting pieces out and shifting them trying to find the most logical order. When I became happy about the results, I asked a colleague to review my work. The final version of the flow must be made in Adobe Illustrator. However, I like use paper prototyping as tool before going into the digital process. The reason why I choose the tool paper prototyping is because even though the sketches are a rough first setup, you will be able to test it in an easy way. After doing small tests and figuring out what works and what doesn't, I took the feedback with me when digitalizing the flow. The image below gives a sneek-peek in my workprocess with the program Adobe Illustrator.


It took some time to get everything in a logical order. Eventually after reviewing, testing and redesigning, you can see the end result in the image below. The flow is meant for the visual designer, the developers and the client. The visual designer will make the designs for the app based on my flow with the screens. The flow is also useful for the developers because they will be building the app. With the flow they will have a clear overview of the navigation structure. The client can experience how the product is put together. This way the client will get a better idea on how the app will function.

By clicking on the image below you will be able to download the file as pdf, if you'd like to take a closer look at the flow.


WAP - Work @ perspective

This service will support the days between unemployment and work for the society. During the course Service Design, a service must be devised to tackle a social problem. We can choose from existing problems to design a service for, but there was also the choice to choosing our own subject.

Wondering how we came up with the idea to help the unemployed get through the heavy period of unemployment?

Service Design project

The assignment: Help solving a social problem by designing a service

For the course Service design we went to work on designing a service. For the most of us it was the first time designing a service. This project was done in project groups.


First, we looked for a social problem because we want to challenge ourself to find our own subject and not choosing from the problems that course already has to offer. After a few brainstorm sessions we finally chosen a domain. This is the domain: unemployment. We think it's an interesting subject where we'd like to delve into and explore further.

To gather insights about the target group of unemployed, we did some interviews. For interviewing we used a probe, we asked our participants to draw a timeline of how their regular day looks like. During the drawing we asked about specific points in the timeline. We asked them why they did those chores and how they felt when doing them. We also went to see a number of employment agencies to get insights in how they're help people getting back on track. In addition to field research, we did some desk research as well. The main findings are brought together to form a new concept.

Ideation and design

The concept will help jobseekers bridge their unemployed period. The person comes into contact with the service via various channels. Through search results on Google, advertising, social media and more. The first time using the platform will include watching videos, reading the forum and relevant information. Information about the application can also be found on the website. When the person registers, he gets deeper access to the service.

The website provides practical information and references to downloading the app. In the app are more functionalities that helps the unemployer get his life on track.

    1. Respond to forum or post a message.

    2. Match with other jobseekers or find a mentor who will support him or her.

    3. Appointments can be made at meeting places, social events and internships can be visited.

The concept is visualised in the service blueprint, which is shown below. The touchpoints, actions and other interactions that are relevant to our service are included in this visualization. The blueprint is subdivided into different sections such as front / backstage, support process, customer experience and physical evidence. In addition, the blueprint clearly shows which actions the user goes through. This makes it clear what the user is faced with, which processes he / she sees and which touchpoints he / she (can) use. You can also download the service blueprint in pdf to take a better look by clicking on the image of the service blueprint.

Wall Drawings

Besides designing interactive experiences for digital platforms, I also like to express my creativity by drawing. Along the design process I used some UX-methods and techniques. For the office of my previous internship last year, I made a huge drawing on the wall. In the picture on the rightside you'll see me deeply concentrated working my magic on the wall.

Curious about the end result? I'm happy to show you the whole process.


Visual Design - project

Wall drawings

With this kind of projects I can truly express all my creativity. The challenge for me is to really show what the company D-TT multimedia is all about. It is also something I give back to the company. A permanent forever standing piece of art on the walls of the office so they will be always reminded of me and my time during the internship. The width of the wall where I did the drawing on is more than seven meters.


Research and ideation

"What should I draw on a canvas with a width of more than seven meters?" That was my first thought. The client for this project is the director of the compamy. By looking at the values and appearance of the company I wrote down a few key words that whould represent the company. The typical Amsterdam canals and beautiful canal buildings are one of the first things I implemented into the drawing, this is because the location of the company. It is located at the inner center of the city Amsterdam. The company also works for a lot of different clients. The bond the company has with its clients is also very important factor. I like to play with little details in the drawing, this is a signature style of mine. Besides asking what the director whould like to see, I also went asking colleagues from other departments what they whould like to see on the walls. With all the input, I decided to do a segmentations of the findings. Then I started to sketch. I wasn't satisfied with the first sketches, the process of searching for the right style of illustrations and making a decision to continue with a certain style is one of the hardest part.

Design and drawing on the wall

When all the pieces of the sketches are falling into place, I scanned the work in. With the program Adobe Illustrator I continued my adventure to create something beautiful. Making different versions of the design and choosing the best out of them all has cost more time then I had expected. It was difficult for me to came up with the best suiting solution to fill in the whole wall. When the final drawing was approved, the part where most effort required began. Putting the drawing from my laptop onto the wall.


Luckily I borrowed a beamer for this part. The drawing was cut into smaller sections and then projected onto the wall with the beamer. This is because the beamer didn't reach the entire range of the wall. I struggled a lot to get the drawing projected. When the projected drawing was placed on the wall I went over the lines with a pencil. After all the lines were covered, they could be colored in with black paintmarker. Most of the little details in the painting I needed to do without the beamer because those parts where too small and specific for the projection to get it right.

This is the final result of the wall. I decided to only use black paint because there are already lots of things going on. Adding more colors to the painting will be too much. This way the painting gives a stronger impression.


© 2017 Lananh Nguyen Anh