Workshop Interactive UI Design MOCKUP  is an online workshop held by the HUMIC Engineering Research Center (HUMIC RC) together with INIXINDO through Zoom media. This activity was held for two days, starting from November 23, 2020, to November 24,  2020, by presenting Mrs. Cindy Permatasari (UI / UX expert, assistant director of INIXINDO) as the main speaker. This workshop is a follow-up to the HUMIC Talkshow “How to be a UI / UX Designer” which was held on September 21, 2020, with the same speakers. The first day of the workshop was opened by Mr. Isman Kurniawan as the deputy director of RC HUMIC by giving a speech. This workshop succeeded in attracting 22 applicants with 20 participants attending the activity. Applicants and participants consist of students, lecturers, and others with various backgrounds in their fields of expertise from all over Indonesia.

On the first day of the workshop, Mrs. Cindy discussed in advance what are the basics that need to be understood by someone who wants to become a UI / UX designer as a first step to be able to design something. The purpose of this discussion is so that workshop participants can understand the concepts and mechanisms of design thinking to produce an idea that can be implemented into a wireframe. Some basic aspects that need to be understood by a designer include design thinking, user experience, and user interface.

According to Mrs. Cindy’s explanation, one needs to have a designer mindset by understanding design thinking. Design thinking is a method (framework) in our mindset or how we approach as designers to be able to solve problems with a focus on a human-center approach (user needs). In studying design thinking, it is important to explore the creative confident side as a learning reference to be able to understand/show what work has not been completed. In this discussion session, Mrs. Cindy invited the participants to try to describe the things that were requested using the help of the miro application.

During the design thinking practice session, Mrs. Cindy also explained five important steps/things in design thinking including:

1. Emphatize: How a designer needs to be able to position himself with what the user feels like a form of research.
2. Define: From the research results, the designer can define what the real user needs are.
3. Ideate: Brainstorm with users and teams to find solutions.
4. Prototype: Creating a project framework to answer the problem.
5. Test: Implement the project.

During the discussion on design thinking, Mrs. Cindy also asked participants to try to make a sketch/idea from the example case given as shown in Figure. From the various ideas that have been outlined in the sketch, participants were asked to put these ideas into a project framework low-fidelity (wireframe). The making of this wireframe was the end of the first day of workshop activities. A discussion about high-fidelity UI design with Adobe XD and interactive mockup making will be given on the second day of the workshop. We hope that the activities on the first day can provide benefits to all participants.