Designing Various Features

Project Info

Working in payment group makes me able to take some other projects. It does not necessarily be a website or landing page design. Sometimes I need to design or improve the Merchant's Dashboard page or improve the design of the current feature, or even designing new feature. In this page, I'm putting sample of my works, some are released and some are not.

  • Status : Various
  • Project Member: 1 Project Manager, 1 Designer, usually 2-3 Engineers.

Creating Various Features for Payment


The features I design can be a request from our customer (through our business people) or the initiative taken from development side to improve the system.
The design process usually is not started with research. Normally, I develop the mock-up and I give it to business people to be reviewed. The process will take so much time because if they don't like it I have to revise and send it for review again and so on...

Designing for User

I design for user, therefore I have to think like user. However, I can not do in-depth user research because of the limited time and resource, so I looked for another way to solve this problem.
I learnt from another design from inside the company, develop 2 or more designs and ask the developers outside my team for opinion.

For example, in this feature, we want to show data on sandbox. However, some data on sandbox need to be masked because sandbox is testing environment. So I develop 2 mock-ups and I ask some people if they can understand the information displayed on the screen.

Iteration Process
  1. On first iteration, I developed 2 mock-up, the left and middle images. Then I asked people, if they can get the information they need quickly.
  2. On second iteration, I create the final mock-up (right) based on the first iteration.

Power of Working Prototype

Sometimes when the feature is too complicated, I created a working prototype to show how it's going to work.
This is one of sample features. I need to create download CSV file interface based on the number of orders a merchant get. However, if the number of orders is too many, the system only show first 10 orders.So when user click the "download all" button, they don't know how many files are downloaded.

My idea is to put numbers next to the button and I create a working prototype to explain it.

Comparison Table with Competitors
  1. I demonstrate how I put number next to the button to show how many data user actually download.


As a result, the design review process that usually takes more than 2 weeks can be shortened into a week without sacrificing the quality. (50% reduction)
By creating working prototype, it's easier for me to observing the user behaviour, thus proposing a better design.
Here are some of the features that I designed.

Various Function

Learned lesson

I always did something I was a little not ready to do

Marissa Mayer CEO of Yahoo!

Most of the design project I was involved require me skills that I'm not super good on it. Name it JSON, PHP, or even I do selenium coding (for Galen Framework).
Through all these project I learnt how to accept challenge and listen more to user. What we think is more likely to be different from what user think.

Creating Various Features for Payment


We have this page containing all popular and big merchants that collaborating with us. The business side asked us to develop a content management so that they don't have to edit HTML everytime they collaborate with new merchant. Most of these business are not really comfortable with technical stuffs.

I arranged a meeting diretly with the coordinator from business unit. Some engineers had completely given up because the requirement keeps changing.

Understanding what User Want

As designer, we need to listen to understand, not to reply. After the meeting I found out that their biggest problem is noone there can write JSON or XML. Eventhough we built the JSON or XML structure, it will be meaningless because noone comfortable editing JSON or XML program on text-editor.

My suggested solution is creating a Excel Macro that can generate JSON data and what they have to do is just to fill the cell with necessary info.

Categorizing the old sites
  1. Problem is the user don't know how to create JSON file.
  2. So I create an excel function that can generate JSON syntax and they just need to copy and paste it.

Result and Learned Lesson

The project was done in 1 week and my manager was impressed on how I managed to tackle the problem. I managed to improve the efficiency because the resource for this task can be allocated for another project.

Beside learning how to generate HTML content with JSON, I learnt to listen to user needs. Sometimes the written requirement do not reflect the user need. What we need is to communicate with them.

JSON final product