Nurhidayah, Fadilla Rizky (2025) Pengembangan Front-End Website Ergocheck Menggunakan Framework Next.JS Berbasis React Dengan Evaluasi Heuristik Nielsen. Other thesis, Institut Teknologi Sepuluh Nopember.
|
Text
5025211110 - Undergraduate_Thesis .pdf - Accepted Version Restricted to Repository staff only Download (5MB) | Request a copy |
Abstract
Penggunaan komputer yang semakin intensif di lingkungan kerja modern telah membawa tantangan baru dalam aspek kesehatan, terutama terkait ergonomi. Praktik ergonomi yang buruk dapat meningkatkan risiko gangguan muskuloskeletal (MSD), yang berdampak pada produktivitas dan kesehatan pekerja. Metode evaluasi ergonomi tradisional yang dilakukan secara manual sering kali tidak efisien, rentan terhadap subjektivitas, dan sulit diakses dalam skala besar. Untuk menjawab permasalahan tersebut, dikembangkan aplikasi web bernama ErgoCheck dengan menggunakan framework Next.js berbasis React. Aplikasi ini menyediakan fitur unggahan foto dan video postur kerja, kuesioner ergonomi, serta laporan evaluasi postur yang dilengkapi dengan rekomendasi perbaikan. Pengembangan antarmuka dilakukan dengan paradigma React yang mengedepankan modularitas dan prinsip reusable component untuk meningkatkan efisiensi dan skalabilitas sistem. Evaluasi aplikasi dilakukan melalui pendekatan heuristik Nielsen untuk menilai kenyamanan dan kegunaan antarmuka, serta pengujian teknis menggunakan Google Lighthouse yang mencakup aspek performa, aksesibilitas, best practices, dan SEO. Hasil pengujian menunjukkan skor Performance sebesar 100, Accessibility 93,8, Best Practices 98,7, dan SEO 100. Evaluasi heuristik turut mengonfirmasi bahwa antarmuka telah memenuhi sebagian besar prinsip usability, sekaligus memberikan wawasan untuk peningkatan lebih lanjut.
==================================================================================================================================
The increasing use of computers in modern work environments has introduced new challenges in occupational health, particularly in the area of ergonomics. Poor ergonomic practices can elevate the risk of musculoskeletal disorders (MSDs), negatively impacting both productivity and employee well-being. Traditional ergonomic evaluation methods, which are typically conducted manually, are often inefficient, prone to subjectivity, and difficult to scale. To address these issues, a web-based application called ErgoCheck was developed using the Next.js framework based on React. The application offers features such as photo and video uploads of working postures, ergonomic questionnaires, and posture evaluation reports equipped with improvement recommendations. The front-end interface was developed using the React paradigm, emphasizing modularity and reusable components to enhance efficiency and scalability. The application was evaluated using Nielsen’s heuristic evaluation to assess usability and user comfort, as well as technical testing through Google Lighthouse, which measures performance, accessibility, best practices, and SEO. The results showed excellent scores: Performance 100, Accessibility 93.8, Best Practices 98.7, and SEO 100. Heuristic evaluation confirmed that the interface aligns with key usability principles while also providing insights for further enhancement.
| Item Type: | Thesis (Other) |
|---|---|
| Uncontrolled Keywords: | Accessibility, Evaluasi Heuristik Nielsen, Evaluasi Postur Kerja, Google Lighthouse, Musculoskeletal Disorders (MSDs), Next.js, React, Supervisor Monitoring |
| Subjects: | T Technology > T Technology (General) > T57.5 Data Processing T Technology > T Technology (General) > T57.84 Heuristic algorithms. T Technology > T Technology (General) > T58.64 Information resources management |
| Divisions: | Faculty of Intelligent Electrical and Informatics Technology (ELECTICS) > Informatics Engineering > 55201-(S1) Undergraduate Thesis |
| Depositing User: | Fadilla Rizky Nurhidayah |
| Date Deposited: | 13 Jan 2026 03:42 |
| Last Modified: | 13 Jan 2026 03:42 |
| URI: | http://repository.its.ac.id/id/eprint/129543 |
Actions (login required)
![]() |
View Item |
