A single-page website development

Patternup is an online service that customers are able to customize pattern design from an editor of Patternup website. Before the service launching, they intended to inform their service.


We developed and designed a website that has service information for reaching the potential customers to know the service of Patternup. Finally, it makes an opportunity that the potential customers are to be loyal customers by the website.

  • Give a positive impression that makes interesting.
  • Keep to be relationship till the service opened.
  • Gathering visitors behaviour from the website with Google Analytics. Then use the data into the marketing strategy.


We conducted research on pattern design and interior e-commerce field to find out about their hardships and needs when they go to the service launching step.

  • Based on the research data obtained, we created a layout and contents which is simple and readable, without decoration materials. This helped us to understand the related e-commerce field better so that we could develop and design a better solution for the approach the goals.
  • So, the three ideas with different layouts with each content were generated and presented to our client and external people for feedback and evaluation.
  • Ultimately, with multiple iterations, we came up with a one-page website which is simple and readable.
Period: Jan 2018
Client: Patternup
Role: Website design, development


1. Research

For our research, we initially conducted quick and open-ended (unstructured) discussion and brainstorming to find out the current problems and needs that the company face. Then, with the focus on developing a website, we conducted several semi-structured discussion and contextual inquiries to better understand the needs.

Short, open-ended discussion - We eventually narrowed down on designing a solution for better layouts and contents.

Semi-structured discussion - once we defined the needs, We create the first layout and a content then we did reconfirm and measure the layouts and contents whether that make to give satisfied the potential users. The semi-structured discussion was a great way to gather detailed feedback and responses on our first layout and contents.

Based on the semi-structured discussion and the first layout with the content, we create two more drafts. That step was the start step of designing and developing.

2. Building mock-ups

Based on the semi-structured discussion, we create three drafts.

As you see above, the crafts have different constructures. the first thing is full of contents including 'Coming soon message, video content, features of service and process of the service' The gaols are that 'visitors play the video content'

The second is similar to the first draft, but one thing is more 'e-mail subscription' and slightly different layout structure. We carefully concerned whether the e-mail subscription could be efficient for gathering potential customers or not.

The third draft has a compressed structure that consists of a few text lines, video content and e-mail subscription. In our perspective, that could be simple and easier to present what we want to express if the video content contains the full of Patternup explanation, but we don't think.

3. ABC Test (AB test)

4. Select one and tidy-up the selected draft

From discussions with the client and external people, we finally selected the first draft.


  • E-mail description is not effective to approach the goals we defined.
  • Regarding the video content, that contains only a usage of PATTERNUP online service. (if we select the third one, we need to create more video content that has the features.

4. Designing, cording and publishing