UI/UX REDESIGN UNTUK LAMAN ORGANISASI TRASH HERO

PRANOTO, FIRMAN SURYO (2026) UI/UX REDESIGN UNTUK LAMAN ORGANISASI TRASH HERO. S1 thesis, Universitas Mercu Buana Jakarta.

[img]
Preview
Text (HAL COVER)
01 Cover.pdf

Download (386kB) | Preview
[img] Text (BAB I)
02 Bab 1.pdf
Restricted to Registered users only

Download (241kB)
[img] Text (BAB II)
03 Bab 2.pdf
Restricted to Registered users only

Download (761kB)
[img] Text (BAB III)
04 Bab 3.pdf
Restricted to Registered users only

Download (386kB)
[img] Text (BAB IV)
05 Bab 4.pdf
Restricted to Registered users only

Download (748kB)
[img] Text (BAB V)
06 Bab 5.pdf
Restricted to Registered users only

Download (199kB)
[img] Text (DAFTAR PUSTAKA)
07 Daftar Pustaka.pdf
Restricted to Registered users only

Download (184kB)
[img] Text (LAMPIRAN)
08 Lampiran.pdf
Restricted to Registered users only

Download (587kB)

Abstract

The official website of Trash Hero, a global environmental organization, presents several UI/UX problems: inconsistent layout and grid, suboptimal color contrast and typographic hierarchy, and inconsistent icons, CTA buttons, and form fields, which reduce usability, findability, and the user experience. This project aims to identify the visual elements that must be considered and to describe their application in redesigning the website. The design employs Wallas' Four Stage Model of Creativity (Preparation, Incubation, Illumination, Verification). The concept "Clean, Consistent, and Directed" is applied through a consistent single-column layout, a color style guide with yellow as the primary identity, a structured typographic hierarchy, and a standardized design system, realized as an interactive High-Fidelity prototype in Figma. Validation through a User Acceptance Test involving 47 respondents yielded an acceptance index of 94.5% (very strong), confirming that the redesign effectively addressed the identified problems. Keywords: UI/UX, redesign, Trash Hero, Wallas Four Stage Model of Creativity, User Acceptance Test. Laman resmi Trash Hero, organisasi lingkungan global, memiliki sejumlah permasalahan UI/UX, yaitu ketidakkonsistenan layout dan grid, kontras warna serta hierarki tipografi yang belum optimal, dan inkonsistensi gaya ikon, tombol CTA, serta form field, yang menurunkan usability, findability, dan pengalaman pengguna. Perancangan ini bertujuan mengidentifikasi elemen visual yang perlu diperhatikan serta menguraikan penerapannya dalam perancangan ulang laman tersebut. Perancangan menggunakan Wallas' Four Stage Model of Creativity (Preparation, Incubation, Illumination, Verification). Konsep "Bersih, Konsisten, dan Terarah" diterapkan melalui sistem layout satu kolom yang konsisten, style guide warna dengan kuning sebagai identitas utama, hierarki tipografi yang terstruktur, dan design system yang baku, diwujudkan menjadi prototipe High-Fidelity interaktif di Figma. Validasi melalui User Acceptance Test terhadap 47 responden menghasilkan indeks penerimaan 94,5% (kategori sangat kuat), yang menegaskan bahwa hasil redesign efektif menjawab permasalahan yang teridentifikasi. Kata Kunci: UI/UX, redesain, Trash Hero, Wallas Four Stage Model of Creativity, User Acceptance Test

Item Type: Thesis (S1)
NIM/NIDN Creators: 42319110026
Uncontrolled Keywords: UI/UX, redesain, Trash Hero, Wallas Four Stage Model of Creativity, User Acceptance Test
Subjects: 000 Computer Science, Information and General Works/Ilmu Komputer, Informasi, dan Karya Umum > 000. Computer Science, Information and General Works/Ilmu Komputer, Informasi, dan Karya Umum > 004 Data Processing, Computer Science/Pemrosesan Data, Ilmu Komputer, Teknik Informatika > 004.2 Systems Analysis and Computer Design, Computer Architecture, Computer Performance Evaluation/Sistem Analis dan Desain Komputer, Arsitektur Komputer, Evaluasi Daya Guna dan Performa Komputer > 004.21 Systems Analysis and Computer Design/Sistem Analis dan Desain Komputer
100 Philosophy and Psychology/Filsafat dan Psikologi > 150 Psychology/Psikologi > 152 Sensory Perception, Movement, Emotions, Physiological Drives/Psikologi Fisiologis > 152.1 Sensory Perception/Persepsi Indera > 152.14 Visual Perception/Persepsi Visual
Divisions: Fakultas Desain dan Seni Kreatif > Desain Komunikasi Visual
Depositing User: khalimah
Date Deposited: 23 Sep 2026 12:10
Last Modified: 23 Sep 2026 12:21
URI: http://repository.mercubuana.ac.id/id/eprint/104076

Actions (login required)

View Item View Item