Revamping the Ideabox Landing Page at Digital Amoeba PT Telkom Indonesia — UI/UX Case Study

The product I have produced is the result of a project that I worked on while I was doing an internship at the Digital Amoeba internship program at PT Telkom Indonesia. The Digital Amoeba Program is a Corporate Innovation Lab. by Telkom Indonesia which incubates and accelerates passion-based innovations for Telkom employees aimed at impacting the company and Indonesia.

Overview 👋

Ideabox is an Idea Crowdsourcing Platform that is here to develop an Innovation Ecosystem and spread an Innovation Culture through the delivery of innovative ideas and collaboration.

Innovation development through Ideabox is the answer to problems and challenges as well as an acceleration of Indonesia’s digital ecosystem which is able to help gather ideas for exploring potential new businesses and developing business strategies.

My Role & Team

In the process of working on the Ideabox website design, it was carried out in groups consisting of 2 UI/UX Designers including me and 2 UI/UX Researchers.

Goals

Conceptualizing and revamping designs including wireframing (Low-Fidelity Design), High-Fidelity Design, prototyping, and improvement/building of new products.

Design Process 🪄

In the project work process, we use the Design Thinking approach. Design thinking is used because it is very practical to use in solving a complex problem by finding information related to human needs. The following are the steps taken:

Brief

Currently, the existing landing page on Ideabox does not adequately represent the purpose of the platform, which is to provide a special way for visitors to access the choice of product or service variations they wish to purchase. Potential customers are expected to make future purchases. Second, the Ideabox landing page can also function to speed up transactions.

In addition, there are problems on the Ideabox website, namely the appearance and colors that are less attractive, inconsistent fonts and icons, so that it is less attractive to users.

Define the Problems

The first process is to define the problems found on the Ideabox landing page. This activity was carried out in collaboration with the UX Researcher team.

Research & Benchmarking

The next activity carried out is to conduct research and benchmarking. We apply a benchmarking process based on the object and benchmarking based on the subject which aims to gain deeper insights. Some of the sources we take for benchmarking are as follows:

• Ideabounty

• Openideo

• Innocentive

From the benchmarking process that has been carried out, the insights obtained are obtained. All of these insights will later be used to determine solutions when creating Ideabox landing page designs. There are 4 extracting insights in the benchmarking process carried out, namely:

• What’s good and appropriate?
• What is still lacking and not quite appropriate?
• What kind of information/content needs to be on Landing Page Ideabox?
• What content should be focused on/highlighted?

The following are the results of insight exploration carried out:

Ideation

After getting the insights that have been collected based on the results when benchmarking. Next is to carry out discussions, brainstorming, and synthesis to determine solution ideas that will later be included on the Ideabox landing page. When determining the solution idea, was carried out together with the UX Researcher team. The following are the solution ideas generated in the ideation phase:

Wireframe

In this phase, my team and I started translating the solution ideas that we had created into a wireframe where everyone had to make their own wireframe. After everyone finished working on the wireframe, we voted to choose which sections fit the needs and look attractive to users.

When you have finished voting on solution ideas created from several wireframes, then you will create the main wireframe which consists of sections that have been approved by all team members.

Besides that in the process of making the main wireframe, we collaborated with the Copywriter team to determine the copywriting that will later be contained in the wireframe. The details of the results of the wireframe that has been created are as follows:

Result:

High-Fidelity Design

The following is the result of the final solution design that we have made by adjusting the latest brand design that has been determined and considering various aspects of User Interface Design and User Experience Design.

Disclaimer:

We used 3D illustrations on the landing page sourced from Envato.

Conclusion & Lesson Learned ✨

• In the results of projects that have been made, I have gained a lot of insight and learned many new things in the process of making designs and making changes to a design. In the process of working on it, I try to provide the best solution to various kinds of problems that exist for users who don’t feel satisfied with the first solution.
• I also learned about the communication process with the team regarding how to determine the right solution without assumptions and continue to think creatively in developing the right solution to solve problems.

Thanks for reading my Case Study! Glad to be able to share the process and hopefully it can continue to be useful for readers. I’d love to hear any feedback from you at gandakur09@gmail.com or connect with me on LinkedIn.

Don’t forget to give Claps 👏