Portofolio Nathan Gunawan

Ngunawan
6 min readJan 3, 2024

--

Link Figma:

https://www.figma.com/proto/jXHyTVSIWHUcZKfaQUvDS1/Untitled?node-id=287-1204&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=287%3A1204

Link Github:

Disclaimer & Acknowledgmenet

This project stands as the culmination of our efforts in the System Analysis Design final project. Our team, consisting of Nathan Gunawan, Devina, and Richard Adberto, collectively worked on this project, with me taking the role of the project manager.

Background

The inspiration for this project arose from the System Analysis Design course under the guidance of Mr. Andreas at Ciputra University Surabaya. We were tasked with prototyping an app tailored for Micro, Small & Medium Enterprises (MSMEs). With an entire semester at our disposal, we decided to focus on creating a cashier app for a local restaurant named “Depot Bu Indra.”

Objectives

Our primary objectives were to establish control over inventory, track income and profit, and monitor expenditures for “Depot Bu Indra.”

Team Roles

The four-member team was comprised of Nathan Gunawan (Project Manager), Devina, Richard Adberto, and myself. Our roles were clearly defined:

  • Nathan Gunawan: Project Manager, responsible for prototype, paperwork, app features, database design, 90% of the design app, etc.
  • Devina: System Designer, contributing to the app’s design
  • Richard Adberto: Report Maker, involved in creating all the necessary reports
  • Giovanni Wisman: System Analyst, involved in creating flowcharts and other related tasks.

Task Specification

Our responsibilities included in-depth research on “Depot Bu Indra,” system design, prototype creation, user-testing documents, and conducting user-testing sessions.

Design Process

We followed the Design Thinking methodology for our app development.

Stage 1: Empathize — Research Your Users’ Needs

We gathered information from “Depot Bu Indra” to understand their specific requirements and preferences.

Stage 2: Define — State Your Users’ Needs and Problems

We analyzed data from the restaurant owner, utilizing Google Sheets templates provided by the lecturer.

Stage 3: Ideate — Challenge Assumptions and Create Ideas

Brainstorming sessions and face-to-face discussions were crucial for generating ideas, supported by collecting cashier app mock-ups for inspiration.

Stage 4: Prototype — Start to Create Solutions

This stage involved creating user flows, detailed in six flowcharts, and developing mockups and prototypes for various app sections, including Inventory, Sales, History, and Report Generator.

Stage 5: Test — Try Your Solutions Out

Testing involved real users, particularly the restaurant owner. We used Single Ease Question (SEQ) and Customer Satisfaction Score (CSAT) matrices, achieving an overall CSAT of 9/10 and an SEQ average score of 6.3/7.

Testing Scenario:

https://docs.google.com/document/d/1hMRJVBNqEj5hqyiwIgO7LXY8vsuD_V85/edit?usp=drivesdk&ouid=112614897048673677351&rtpof=true&sd=true

Testing Process

I later went to Depot Bu Indra and ask the manager to demo the application.

Nb: I could not insert any of the owner’s information here as it was part of their privacy.

Interview and App Testing Process

Testing Result

After the user completed all tasks, I asked them the overall Customer Satisfaction Score(CSAT) as we had asked the Single Ease Question(SEQ) matrix each time they finished the task. The overall CSAT they gave was 9/10, and the average score of the SEQ was 6.5/7. And last, the user passed all of the functions.

· CSAT

The CSAT score was based on the overall experience they did and additional questions:

1. Design(9/10): They like the color selection, and the overall design. Making it more precise would make it 10/10.

2. Simplicity & Easiness(10/10): It is very simple and user friendly. Perfect.

3. System(8/10): Overall strategy and menu was fine but could have add more menus.

· SEQ

The SEQ scoring was taken right after each task had been done. Each time they gave the score, we also asked the reason. There were some positive comments and criticisms.

(+) Easy to use.

(+) Simple.

(+) Love the design

(-) You can add more graphs to make it more complete

Mock Up & Prototype

Login Menu

This page is the initial page that appears when the user opens the desktop application. It will display the login menu where the user can enter their username and password.

Welcome Page

When logged in, there will be 5 main menus in this program, each serving its purpose. First, the point of sales. This menu is a cashier program where the cashier can input food items and add their data to the database. Additionally, there is also a logout option in the top right corner for users to log out.

Point Of Sales

The first menu is the point of sales. In this menu, the first thing displayed is a list of food, drinks, and snacks. In addition, the cashier can add these items to the bill to create and save it. When creating, the cashier will be prompted to input the employee’s name, customer’s name, and table number. If correct, the cashier can save the bill. Once the bill is saved, the cashier can view the list of created bills. The cashier can also delete a bill if there is an error.

Maintenance item master.

Maintenance item master is divided into 2 sections, namely catalog and employee. The main function of this menu is to add, edit, or delete employee or catalog data. If ‘employee’ is selected, a list of employee photos will be displayed with an option to add employees. If an employee photo is selected, it will show detailed employee data that can be edited. If the user selects the ‘catalog’ menu, a list of food, drinks, and snacks will be displayed. Then, the cashier can edit the price, menu name, as well as delete and add new food/drink/snack.

Report & history

This menu will display several things. Firstly, on the left side, a list of sold bills for a selected date will be shown based on the user’s choice in the combobox. If one of these bills is clicked, a new form will appear containing the details of that bill. Secondly, the user can input a specific date range, and the program will output the revenue, expense, and net profit during that period

SOP

In this menu, users can view the detailed Standard Operating Procedures (SOP) owned by the company.

Expense Menu

In this menu, users can view the expenditures for a specific month. Additionally, users can add (record) the company’s expenditures, including COGS, operational costs, and others.

Restricted Menu

This menu will appear when a user doesn’t have access to a certain page.

User Test Log

https://docs.google.com/spreadsheets/d/1H3grnxI8ZjXagE2-NPlAB0fdVMQZYdXU/edit?usp=drivesdk&ouid=112614897048673677351&rtpof=true&sd=true

Conclusion

Our app received positive feedback with room for improvement, garnering a satisfactory CSAT score of 9/10 and an SEQ average of 6.5/7. We acknowledge the support and guidance received from our lecturer, Mr. Andreas, and appreciate the collaborative effort of our team. This portfolio reflects our dedication to the project, aiming to provide insight and potential benefits. Thank you.

--

--