…
comment: The repository administrator has not yet configured an RDF license.
primary topic: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN
type: Thesis
type: Article
abstract: The rapid growth of the modern software industry demands high-quality, consistent, and maintainable user interfaces (UI). Although Generative Artificial Intelligence (AI) technology has opened opportunities for automating UI code generation, the resulting code is often unstructured, difficult to maintain, and inconsistent with standardized component development patterns. This research aims to design and develop an Atomic Design-based UI generator system utilizing a Large Language Model (LLM) as its code generation engine. The system was developed using the Next.js framework, integrating frontend and backend layers within a unified framework, and utilizing the Google Gemini API as the LLM model. The Atomic Design approach was implemented through a layered prompt engineering technique that explicitly embeds the Atom, Molecule, Organism, Template, and Page hierarchy instructions into every prompt. The system supports three input modes Standard Prompt, Template Builder, and Structured Form to accommodate various user needs ranging from creative exploration to controlled academic testing. Evaluation was conducted through output testing and black-box testing across 12 functional scenarios. The results demonstrate that the system successfully generates UI components automatically in both HTML/Tailwind CSS and React JSX formats, with consistent and modular structures aligned with Atomic Design standards. All black-box testing scenarios achieved a Passed status. The layered prompt engineering mechanism proved effective in guiding the AI model to produce interface code that is consistent, modular, and compliant with Atomic Design principles.
date: 2026-06-04
status: published
author list: authors
type: EPrint
type: ThesisEPrint
is part of: repository
has document: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
has version: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
has published: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
has document: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Other)
subject: 005.36 Software Development / Pengembangan Perangkat Lunak

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
type: Document
has file: 22106050021_BAB-I_IV-atau-V_DAFTAR-PUSTAKA.pdf
has part: 22106050021_BAB-I_IV-atau-V_DAFTAR-PUSTAKA.pdf

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
type: Document

UIN SUNAN KALIJAGA YOGYAKARTA
type: Organization

FAKULTAS SAINS DAN TEKNOLOGI, UIN SUNAN KALIJAGA YOGYAKARTA
type: Organization

NIM.: 22106050021 Mufid Bahaudin Nugroho
type: Person
given name: NIM.: 22106050021
family name: Mufid Bahaudin Nugroho

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Other)
type: Document
is version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
is volatile version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
islightbox thumbnail version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Other)
type: Document
is version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
is volatile version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
ispreview thumbnail version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Other)
type: Document
is version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
is volatile version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
ismedium thumbnail version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Other)
type: Document
is version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
is volatile version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
issmall thumbnail version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Other)
type: Document
is version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
is volatile version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
islightbox thumbnail version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
has file: lightbox.jpg
has part: lightbox.jpg

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Other)
type: Document
is version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
is volatile version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
ispreview thumbnail version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
has file: preview.jpg
has part: preview.jpg

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Other)
type: Document
is version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
is volatile version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
ismedium thumbnail version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
has file: medium.jpg
has part: medium.jpg

RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Other)
type: Document
is version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
is volatile version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
issmall thumbnail version of: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN (Text)
has file: small.jpg
has part: small.jpg

HTML Summary of #77223 RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN
format: text/html
primary topic: RANCANG BANGUN SISTEM GENERATOR ANTARMUKA PENGGUNA BERBASIS ATOMIC DESIGN

005.36 Software Development / Pengembangan Perangkat Lunak
type: Concept