
Adding features and tidying up the layout design
Adding features and tidying up the layout design
Adding features and tidying up the layout design
BRIEF
BRIEF
In this application, employees can easily perform attendance through provided features, such as photo proof. Additionally, this application also provides features to view employee work schedules and leaves, as well as monitor lateness or absences. This HRD application can also facilitate the employee payroll process with data.
In this application, employees can easily perform attendance through provided features, such as photo proof. Additionally, this application also provides features to view employee work schedules and leaves, as well as monitor lateness or absences. This HRD application can also facilitate the employee payroll process with data.
THE CHALLENGE
THE CHALLENGE
How can this system improve efficiency in the employee attendance process and provide benefits in real-time monitoring of attendance and facilitating employee leave requests?
How can this system improve efficiency in the employee attendance process and provide benefits in real-time monitoring of attendance and facilitating employee leave requests?
Request not to change the design too much and add MVP to the application. I worked on it for 5 weeks from this project starting until the application development work stage.
Request not to change the design too much and add MVP to the application. I worked on it for 5 weeks from this project starting until the application development work stage.
The Research
The Research
OLD DESIGN
OLD DESIGN
The definition of what problems exist in the HRD application and evaluation of the application interface is carried out. The following are the problem definitions and evaluations of the application based on research and client requirements:
The definition of what problems exist in the HRD application and evaluation of the application interface is carried out. The following are the problem definitions and evaluations of the application based on research and client requirements:

1
The design of the initial page needs to be redesigned because it lacks sufficient information and has a less organized layout.
2
The leave page has two bars, one for the leave application form and the other for the status, so it needs to be adjusted to be more concise.
3
Adding an attendance log page, attendance summary, and attendance request page.
4
During the application design process, the client requested that the design be changed as little as possible.
Finding Solution
Userflow
Userflow
The definition of what problems exist in the HRD application and evaluation of the application interface is carried out. The following are the problem definitions and evaluations of the application based on research and client requirements:
The definition of what problems exist in the HRD application and evaluation of the application interface is carried out. The following are the problem definitions and evaluations of the application based on research and client requirements:



THE SCOPE
THE SCOPE
Creating Mockup / Hi-Fi
Prototyping Mockup
Present to Client
Create and Add Features
Creating Mockup / Hi-Fi
Prototyping Mockup
Present to Client
Create and Add Features
THE SCOPE
Creating Mockup / Hi-Fi
Prototyping Mockup
Present to Client
Create and Add Features
Deliverable
Deliverable
CHECK IN / OUT
CHECK IN / OUT
On the homepage, a slight revamp was done to make the application look more informative for employees, such as indicating whether they have checked in/out, widening the check-in/out button, displaying employee work schedules, and showing employee attendance history, which is the attendance log.
On the homepage, a slight revamp was done to make the application look more informative for employees, such as indicating whether they have checked in/out, widening the check-in/out button, displaying employee work schedules, and showing employee attendance history, which is the attendance log.
REQUEST ATTENDANCE
REQUEST ATTENDANCE
When an employee wants to request attendance, they press the + button on the homepage, and when it opens, they will see a page displaying the status of their previous requests. The numbers 1, 2, 3 represent the hierarchical levels of superiors from bottom to top. If the request has been approved by level 2, then the request has been successfully submitted.
When an employee wants to request attendance, they press the + button on the homepage, and when it opens, they will see a page displaying the status of their previous requests. The numbers 1, 2, 3 represent the hierarchical levels of superiors from bottom to top. If the request has been approved by level 2, then the request has been successfully submitted.
CUTI
CUTI
Similar to the request attendance page, but when filling out the input form, the employee must select the type of leave, as each type of leave has its own requirements and input fields.
Similar to the request attendance page, but when filling out the input form, the employee must select the type of leave, as each type of leave has its own requirements and input fields.
LOG ATTENDANCE
LOG ATTENDANCE
This page displays a summary of employee attendance for the previous month, and employees can select the date they want to view. The log accordion contains components such as employee schedules, attendance logs showing how many times employees have clicked the check-in/out button to ensure they have checked in/out, and leave codes if employees have requested leave.
This page displays a summary of employee attendance for the previous month, and employees can select the date they want to view. The log accordion contains components such as employee schedules, attendance logs showing how many times employees have clicked the check-in/out button to ensure they have checked in/out, and leave codes if employees have requested leave.
DIRECT REPORT
DIRECT REPORT
This page can be accessed when an employee has subordinates, to view the attendance summary of their subordinates, and search for specific names and dates.
This page can be accessed when an employee has subordinates, to view the attendance summary of their subordinates, and search for specific names and dates.
TESTING
TESTING
USABILITY TESTING
USABILITY TESTING
In this testing phase, feedback will be obtained from SAP itself, and a feedback stage will also be conducted internally within the team before testing it with the relevant parties.
In this testing phase, feedback will be obtained from SAP itself, and a feedback stage will also be conducted internally within the team before testing it with the relevant parties.
TOP FINDING
Feedback
Given 2 design options to minimize the navbar bottom and requested the placement of additional menu features such as attendance, leave, attendance logs, and direct reports.






CLOSING
There were many experiences and lessons learned while working on this project, especially for me who had to understand the workings of the attendance application by conducting research on other competitor applications. There were also much feedback from internal teams and other superiors in the process of developing this application. My communication skills were truly tested here, where I had to take responsibility for the design I created and provide appropriate feedback when some small design components presented did not meet the client’s expectations.
There were many experiences and lessons learned while working on this project, especially for me who had to understand the workings of the attendance application by conducting research on other competitor applications. There were also much feedback from internal teams and other superiors in the process of developing this application. My communication skills were truly tested here, where I had to take responsibility for the design I created and provide appropriate feedback when some small design components presented did not meet the client’s expectations.
There were many experiences and lessons learned while working on this project, especially for me who had to understand the workings of the attendance application by conducting research on other competitor applications. There were also much feedback from internal teams and other superiors in the process of developing this application. My communication skills were truly tested here, where I had to take responsibility for the design I created and provide appropriate feedback when some small design components presented did not meet the client’s expectations.
I am very grateful to my mentor and superiors who were very caring and appreciated my work efforts, even though I felt there were still many shortcomings in the implementation of this application design work. And there is a saying that I still remember and instill in myself,
I am very grateful to my mentor and superiors who were very caring and appreciated my work efforts, even though I felt there were still many shortcomings in the implementation of this application design work. And there is a saying that I still remember and instill in myself,
I am very grateful to my mentor and superiors who were very caring and appreciated my work efforts, even though I felt there were still many shortcomings in the implementation of this application design work. And there is a saying that I still remember and instill in myself,
Zananda Aditya
FEATURED WORKS
Vines Indonesia Revamp
Portofolio by Zananda Aditya
Zananda Aditya
FEATURED WORKS
Vines Indonesia Revamp
Portofolio by Zananda Aditya
Zananda Aditya
FEATURED WORKS
Vines Indonesia Revamp
Portofolio by Zananda Aditya