Hasil Pencarian  ::  Simpan CSV :: Kembali

"Software Product Line Engineering (SPLE) adalah paradigma untuk mengembangkan produk yang bervariasi dengan memanfaatkan commonalities dan variabilities dari aplikasi-aplikasi yang berbeda. Untuk mendukung pengembangan user interface perangkat lunak menggunakan paradigma SPLE, diperlukan suatu abstraksi yang dapat memodelkan user interface. Dalam penelitian ini, teknologi yang akan digunakan untuk memodelkan abstraksi tersebut adalah Interaction Flow Modeling Language (IFML). IFML akan ditransformasikan menjadi kode front end menggunakan User Interface Generator (UI Generator). Dalam pengembangan aplikasi menggunakan paradigma SPLE, terdapat kebutuhan akan static page yang merupakan halaman web dengan konten yang tidak berbeda antara pengguna yang satu dengan yang lain. Untuk memanfaatkan SPLE dalam memenuhi kebutuhan akan pengaturan static page, dibutuhkan cara atau metode yang berbeda dari pengembangan static page biasa. Pada penelitian ini, penulis mengembangkan metode yang dapat digunakan untuk mengembangkan pengaturan static page yang terintegrasi dengan proses generator user interface. Metode tersebut disebut static page management. Penelitian ini masih mengutamakan fungsionalitas dan kemudahan implementasi, sehingga aspek security belum diperhatikan. Selain static page management, penelitian ini juga akan memperbaiki pemodelan SPLE menggunakan IFML. Pemodelan juga dikembangkan lebih lanjut untuk dapat mendukung unggah gambar dan pembatasan akses berdasarkan autentikasi pengguna. Untuk dapat mengakomodasi perubahan pada pemodelan tersebut, UI Generator juga perlu dikembangkan lebih lanjut. Static page management akan dievaluasi menggunakan User Acceptance Testing, yang dilakukan oleh penulis. Sedangkan pemodelan dan UI Generator akan dievaluasi menggunakan six quality criteria. Berdasarkan evaluasi dan eksperimen yang dilakukan, perbaikan pemodelan dan UI Generator sudah dapat digunakan untuk menghasilkan aplikasi front end yang dapat dijalankan dengan baik dan mengikuti desain tampilan terbaru.

---

Software Product Line Engineering (SPLE) is a paradigm that takes advantage of the commonalities and variabilities of different applications to develop products. The development of software user interfaces using the SPLE paradigm needs an abstraction to model the user interface. In this study, the technology used to model the abstractions is the Interaction Flow Modeling Language (IFML). IFML will be transformed into front-end code using the User Interface Generator (UI Generator). In developing applications using the SPLE paradigm, there is a need for static pages. To utilize SPLE on the need for static page management, a different way or method from developing ordinary static pages is needed. In this research, the researchers develop a method called static page management. The static page management is integrated with the user interface generation process. This research will prioritize functionality and ease of implementation. Apart from static page management, this research will also improve SPLE modeling using IFML. The existing modeling is also further developed to support image uploads and access restrictions based on user authentication. UI Generator also needs to be further developed, to accommodate changes in the modeling. The evaluation of static page management is carried out using User Acceptance Testing conducted by the author. While modeling and UI Generator are evaluated using six quality criteria. Based on the evaluation and experiments, the researchers can conclude that modeling improvements and the UI Generator can be used to produce front-end applications that can run properly and follow the latest user interface designs."

"Payment Gateway adalah teknologi perangkat lunak yang menyediakan layanan pembayaran. Seiring berjalan waktu muncul requirement baru dan dilakukan pengembangan perangkat lunak untuk memenuhinya. Namun cara tersebut tidak efisien karena pada tiap iterasi pengembangan requirement baru, diperlukan implementasi ulang requirement yang sudah diimplementasi pada pengembangan sebelumnya. Maka dari itu dibutuhkan paradigma pengembangan perangkat lunak yang terbuka pada perubahan dan penggunaan ulang, yaitu Software Product Line Engineering (SPLE). SPLE adalah paradigma pengembangan perangkat lunak yang memanfaatkan reusable platform dan mass customisation. Pada penelitian ini akan dikembangkan product line untuk Payment Gateway dengan mengimplementasi fitur Payment, fitur layanan pembuatan pembayaran. Penelitian menggunakan framework SPLE yang fokus pada dua tahap dalam Domain Engineering yaitu Domain Design dan Domain Realization. Domain Design akan menggunakan UML-DOP, profil UML untuk merepresentasikan konsep Delta-Oriented Programming, dan U2VMJ Generator, code-template generator dari PricesIDE. Domain Realization akan menggunakan WinVMJ Composer, sebuah FeatureIDE Composer dari PricesIDE. Setelah itu akan dilakukan Application Engineering untuk menghasilkan dan menguji product dari product line. Hasil yang ditemukan adalah dalam satu proses pengembangan perangkat lunak product line Payment Gateway, lima variasi product Payment Gateway berhasil dihasilkan dan diuji dan implementasi pemanggilan external API fitur Payment menghasilkan granularitas fitur.

---

Payment Gateway is a software technology that serves payment services. As new requirements are needed, a software development is done to fulfill it. This method is not efficient because on each software development started to fulfill a new requirement, similar requirements that has been implemented from previous software development need to be re-implemented. A new paradigm in software development is needed that are open to changes and reusability, one of which is Software Product Line Engineering (SPLE). SPLE is a software development paradigm that uses a reusable platform and mass customisation. In this research we will develop a product line of Payment Gateway by implementing a feature called Payment, a payment creation service. This research uses the SPLE framework and focus on two steps in Domain Engineering which are Domain Design and Domain Realization. Domain Design will use UML-DOP, a UML profile to represent Delta-Oriented Programming concept, and U2VMJ Generator, a code-template generator from PricesIDE. Domain Realization will use WinVMJ Composer, a FeatureIDE Composer from PricesIDE. Next, an Application Engineering will be done to generate and test products generated from the product line. It is found that in one software development process of Payment Gateway product line, five variations of Payment Gateway successfully generated and tested and implementation for external API calls in Payment feature cause a feature granularity."

"Adaptive Information System for Charity Organization (AISCO) adalah sebuah aplikasi berbasis web yang berfungsi sebagai website generator bagi organisasi-organsisasi amal. AISCO dikembangkan dengan konsep software product line engineering (SPLE), yakni sebuah pendekatan pembuatan software berdasarkan aspek kesamaan (commonality) dan perbedaan yang dapat diperkirakan (variability). SPLE dapat diwujudkan salah satunya dengan menggunakan konsep delta oriented programming pada bahasa pemodelan Abstract Behavioral Specification (ABS). ABS telah digunakan oleh Laboratorium Reliable Software Engineering (Lab RSE) untuk membuat web framework dengan basis Java dan Erlang OTP. Saat ini, backend AISCO telah dikembangkan dengan ABS web framework berbasis Java. Namun, penelitian sebelumnya menyatakan bahwa memori yang digunakan oleh Erlang lebih kecil dibandingkan Java. Sehingga, AISCO perlu dimigrasikan ke ABS web framework berbasis Erlang OTP. Akan tetapi, untuk melakukan migrasi tersebut dibutuhkan beberapa perbaikan pada ABS web framework berbasis Erlang OTP serta perubahan pada kode ABS. Penelitian ini akan membahas tentang perbaikan yang dilakukan pada framework tersebut dan perubahan yang dibuat untuk melakukan migrasi AISCO. Hasil dari penelitian ini adalah backend AISCO hasil ABS web framework berbasis Erlang OTP dengan penggunaan memori yang lebih rendah dan telah diintegrasikan ke bagian frontend.

---

Adaptive Information System for Charity Organization (AISCO) is a web-based application which aims as a website generator for charity organization. AISCO was developed with software product line engineering (SPLE), which is an approach to create software based on aspect of similarity (commonality) and predictable differences (variability). SPLE can be realized using delta oriented programming in Abstract Behavioral Specification (ABS) modeling language. ABS has been used by Reliable Software Engineering Laboratory (Lab RSE) to create Java and Erlang OTP based web framework. Currently, AISCO backend has been developed with the Java based. However, previous research stated that memory used by Erlang was smaller than Java. So, AISCO needs to be migrated to the Erlang OTP based. However, to perform migration, some improvements are needed to the Erlang OTP based as well as changes to ABS code. This research will discuss improvements made to the framework and changes created to perform AISCO migration. The result of this research is AISCO backend from Erlang OTP based with lower memory usage and has been integrated into AISCO frontend."

"Software Product Line Engineering (SPLE) adalah paradigma pengembangan perangkat lunak yang menggunakan pendekatan common platform dan mass customization yang mampu mengurangi waktu dan tenaga dalam pengembangan perangkat lunak. Untuk mendukung pengembangan produk dengan paradigma SPLE, Precise Requirement Changes Integrated System (PRICES) dikembangkan dan diintegrasikan dengan Integrated Development Environment (IDE) berbasis Eclipse menjadi PricesIDE. Pada PricesIDE antarmuka perangkat lunak akan dimodelkan dengan diagram Interaction Flow Modeling Language (IFML). Penelitian ini bertujuan untuk menghasilkan Plug-in pada PricesIDE yang berfungsi untuk mentransformasi IFML ke React yang sebelumnya dikembangkan berbasis Python. Pada penelitian ini, Plug-In UI Generator dikembangkan dengan Acceleo pada Eclipse agar dapat diintegrasikan dengan PricesIDE. UI Generator juga dikembangkan lebih lanjut agar dapat mendukung berbagai metode saat pemanggilan HTTP dan juga mengatasi adanya foreign key pada basis data. Pengembangan lanjut ini akan dilakukan modifikasi terhadap IFML diagram dan aturan transformasi yang telah didefinisikan sebelumnya. UI Generator akan diuji untuk menghasilkan produk yang sama dengan sebelumnya dengan penambahan fitur laporan tahunan. Melalui eksperimen yang dilakukan, dapat disimpulkan bahwa UI Generator yang dikembangkan pada penelitian ini berhasil menghasilkan website yang sudah mendukung perbedaan metode HTTP dan mampu menangani adanya foreign key

---

Software Product Line Engineering (SPLE) is a software development paradigm that uses a common platform and mass customization approach to reduce software development time and effort. To support software development with SPLE, Precise Requirement Changes Integrated System (PRICES) was developed and integrated with the Eclipse-based Integrated Development Environment (IDE) into PricesIDE. In PricesIDE, the software user interface needs to be modeled with an Interaction Flow Modeling Language (IFML) diagram. This research aims to produce a Plug-in in PricesIDE to transform IFML into ReactJS, which was previously developed with Python. In this research, UI Generator Plug-in was developed with Acceleo in Eclipse, which can be integrated into PricesIDE. UI Generator was further developed to support various HTTP methods and overcome the existence of foreign keys. The IFML diagram and the previous transformation rules will be modified in this further development. UI Generator will be tested to produce the same product as before with the addition of the annual report feature. From this experiment, it can be concluded that UI Generator developed in this research succeeded in generating a website that supported the difference in HTTP methods and the existence of foreign keys."

"Software Product Line Engineering (SPLE) merupakan paradigma untuk mengem- bangkan aplikasi perangkat lunak berbasis platform dan kustomisasi masal. SPLE memanfaatkan commonality antar aplikasi yang termasuk dalam satu product line dan secara sistematis mengatasi variability antar aplikasi-aplikasi tersebut. SPLE digunakan dalam mengembangkan Amanah, layanan aplikasi untuk menghasilkan situs web bagi organisasi nirlaba secara otomatis. Penelitian terdahulu mengembangkan front-end Amanah menggunakan dua plug-in: UI Generator dan FeatureIDE-WinVMJ Composer. UI Generator merupakan plug-in untuk mentransformasi pemodelan abstrak user inter- face dengan Interaction Flow Modelling Language (IFML) menjadi aplikasi React yang dipakai sebagai front-end Amanah. Namun, pemodelan IFML ini belum menerapkan konsep SPLE secara tepat karena prinsip commonality dan variability belum diterapkan antar tur Amanah. Penelitian ini mengusulkan pengubahan pemodelan IFML dengan menerapkan konsep Delta-Oriented Programming (DOP). Dengan menerapkan DOP, UI Generator juga akan diubah agar dapat mentransformasi IFML berbasis DOP. Di sisi lain, plug-in FeatureIDE-WinVMJ Composer digunakan untuk menghasilkan aplikasi back-end serta menu dan rute halaman pada aplikasi front-end. Namun, hal ini melanggar prinsip Separation of Concern sehingga dalam penelitian ini menu dan rute halaman akan diintegrasikan ke plug-in UI Generator. Perubahan pemodelan IFML dan UI Generator dianalisis dan dievaluasi dengan six quality criteria dan functional testing. Hasil dari analisis dan evaluasi menunjukkan bahwa pemodelan IFML dan UI Generator terbaru telah menerapkan konsep SPLE secara tepat serta menu dan rute halaman berhasil terintegrasi pada UI Generator.

---

Software Product Line Engineering (SPLE) is a paradigm to develop software applica- tions using common platform and mass customization. SPLE uses commonality between software applications in a product line and systematically handles its variability. SPLE paradigm is used to develop Amanah, a service to generate websites for non-pro t organizations automatically. Previous studies have succeeded to develop Amanah’s frontend using two plugins: UI Generator and FeatureIDE-WinVMJ Composer. UI Generator is a plugin to transform an abstract user interface model using Interaction Flow Modelling Language (IFML) to React application. However, the commonality and variability concept in SPLE that exists between Amanah’s features have not been implemented in this IFML model. This study proposed a change to the IFML model to implement SPLE correctly by applying Delta-Oriented Programming (DOP) concept. With DOP applied in IFML, the UI Generator also needs to be changed so that it can transform the IFML-DOP model. On the other hand, FeatureIDE-WinVMJ Composer is a plugin to generate backend application and also menu and routes in the frontend application. This two process violates Separation of Concerns Principle so this study will integrate the menu and routes generation to UI Generator. The changes made in both IFML model and UI Generator are analyzed and evaluated with six quality criteria of SPLE and functional testing. The result shows that the modi ed IFML and UI Generator has implemented SPLE correctly and the integration of menu and routes has been applied successfully in UI Generator."

"Software Product Line Engineering (SPLE) merupakan suatu teknik rekayasa perangkat lunak yang memungkinkan adanya reusability dengan memanfaatkan commonability dalam perangkat lunak yang sedang dikembangkan. Salah satu studi kasus pengembangan SPLE yang dikembangkan di Lab RSE Fasilkom UI adalah AMANAH, sebuah aplikasi berbasis web dengan tools Prices-IDE yang ditujukan bagi lembaga amal untuk dapat membuat web organisasi secara mudah. Tidak hanya membantu organisasi untuk memiliki laman web, AMANAH juga memiliki modul laporan keuangan yang dapat dipilih oleh organisasi dan dimanfaatkan untuk menghasilkan laporan keuangan dari organsasi sesuai dengan standar akuntansi yang berlaku. Saat ini AMANAH telah memiliki implementasi laporan keuangan yang berjalan, namun ditemukan bahwa implementasi tersebut belum sempurna serta terdapat aspek-aspek akuntansi yang fundamental yang belum diterapkan dalam modul laporan keuangan pada aplikasi AMANAH. Masalah ini yang menjadi dasar dari penelitian, yakni untuk melakukan rancang ulang implementasi modul laporan keuangan pada AMANAH dengan memperhatikan aspek fundamental akuntansi. Studi literatur yang dilakukan menunjukan bahwa terdapat beberapa jenis implementasi laporan keuangan pada sistem informasi keuangan dan implementasi tersebut dapat dilakukan melalui pendekatan SPLE dan delta-oriented programming. Proses perancangan dilakukan untuk membuat suatu artifak desain yang menjadi dasar implementasi perbaikan modul laporan keuangan hingga diinisiasi suatu solusi perbaikan dengan memperkenalkan suatu metode pencatatan transaksi secara double-entry bookkeeping dengan modul Journal Entry serta metode kalkulasi saldo akun-akun keuangan dengan menggunakan Trial Balance. Implementasi dilakukan dengan memanfaatkan proses SPLE, secara spesifik dengan membuat sebuah delta module bernama Journal Entry yang mendekorasi core module AutomaticReport yang telah ada sebelumnya. Evaluasi pada hasil pengembangan yang dilakukan menunjukan bahwa seluruh skenario functionality test telah dipenuhi dengan baik serta rancang ulang ini juga turut menyelesaikan masalah-masalah yang timbul pada implementasi modul laporan keuangan sebelumnya.

---

Software Product Line Engineering (SPLE) is a software engineering technique that allows reusability in software development by utilizing its commonability. One of the case study project used to discover about software development with SPLE by is AMANAH, a web-based application built with PricesIDE tools for nonprofit charity organizations that allows them to make a website easily. Not only providing charity organizations ability to create a website, AMANAH also have an optional feature of financial report that allows the organization to produce a standard-compliance financial report automatically. Currently AMANAH has implemented the financial report features, but it was considered that the current implementation is not perfect and there are some fundamental accounting principles that hasn’t being implemented in the system. The problem become the foundation of this research, which is to do a revamp process into AMANAH’s financial report module, by observing to generally accepted accounting principles. Literature studies done during the research shows that there are several types of financial report module implementation in accounting information systems and those implementations can be done by utilizing SPLE approeach and delta-oriented programming approach. Planning process was done by creating a design artifact that will be implemented during the implementation process and a revamp solution was initialized by introducing a double-entry bookkeeping method by utilizing Journal Entry module and account balance method by utilizing Trial Balance. These implementation was done by utilizing SPLE process, specifically creating a delta module called Journal Entry that decorates the existing AutomaticReport core module. During the evaluation of the implementation result, all the functional test scenario has been passed and this revamp process has solved the problems occurred in previous implementation."

"Software Product Line Engineering (SPLE) adalah pendekatan sistematis untuk mengembangkan perangkat lunak dari sekumpulan produk perangkat lunak yang dapat digunakan ulang, yang disebut sebagai Software Product Line (SPL). Pengembangan perangkat lunak dengan metode tersebut memiliki banyak manfaat seperti berkurangnya waktu dan biaya untuk membuat produk perangkat lunak. Salah satu web framework yang mendukung pengembangan perangkat lunak menggunakan SPLE adalah WinVMJ. WinVMJ dirancang berdasarkan pendekatan variability module for java (VMJ) dan delta-oriented programming (DOP). WinVMJ menggunakan decorator pattern dan factory pattern untuk mengimplementasikan pendekatan DOP. WinVMJ juga menggunakan Object-Relational Mapping (ORM) Hibernate untuk memetakan objek ke dalam database. Namun ORM Hibernate dibangun untuk mendukung pemetaan inheritance, yaitu konsep sifat pewarisan behavior suatu objek ke subclass-nya. WinVMJ menggunakan decorator pattern sebagai design pattern, di mana suatu behavior objek dapat ditambahkan ke dalam objek yang sudah ada. Penggunaan decorator pattern ini menyebabkan beberapa masalah ketika memetakan objek WinVMJ ke dalam database. Untuk mengatasi ini, diperlukan desain strategi pemetaan yang baru agar objek dapat dipetakan dengan lebih baik ke dalam database. Proses perubahan dimulai dengan memilih desain strategi pemetaan yang cocok untuk memetakan objek WinVMJ yang dibuat dengan decorator pattern. Selanjutnya, desain strategi tersebut diimplementasikan dengan mengubah domain layer WinVMJ. Setelah itu, dilakukan percobaan menggunakan middleware untuk memetakan objek ke dalam database. WinVMJ yang sudah diubah diuji dengan mengimplementasikannya ke aplikasi yang sudah ada dan menggunakan unit test untuk memeriksa objek yang dihasilkan termasuk menguji operasi create, read, update, dan delete (CRUD). Hasilnya menunjukkan bahwa WinVMJ dapat memetakan objek ke dalam database dengan baik.

---

Software Product Line Engineering (SPLE) presents a structured methodology for creating software systems through reusable software products referred to as the Software Product Line (SPL). By adopting this approach, software development yields numerous advantages, including decreased time and costs involved in generating novel software products. One web framework that supports SPLE-based software development is WinVMJ, which builds upon the Variability Module for Java (VMJ) technique and delta-oriented programming (DOP). WinVMJ employs the decorator pattern and factory pattern to implement DOP. This design pattern, decorator pattern, permits the addition of behaviors to existing objects, contributing to WinVMJ's unique functionality. However, incorporating the Object-Relational Mapping (ORM) Hibernate into WinVMJ's architecture, a method for mapping objects to a database, presents a challenge due to Hibernate's orientation towards supporting inheritance mapping—where an object inherits traits from its superclass. Recognizing this challenge, a fresh mapping strategy is deemed necessary to achieve more effective object-to-database mapping in WinVMJ. The change process commences with selecting an appropriate mapping strategy for WinVMJ objects generated using the decorator pattern. Subsequently, the chosen mapping strategy is implemented by modifying WinVMJ's domain layer source code. Middleware is then employed to experiment with mapping objects to the database. The modified WinVMJ is rigorously tested by integrating it into existing applications and subjecting it to unit tests, which observe the behavior of the obtained objects. The testing procedure encompasses create, read, update, and delete (CRUD) operations, ensuring comprehensive evaluation. Remarkably, WinVMJ demonstrates successful object-to-database mapping capabilities.

"

"Software product line engineering (SPLE) merupakan paradigma perangkat lunak yang digunakan untuk memproduksi berbagai varian perangkat lunak dengan waktu dan biaya yang efektif. Penelitian sebelumnya telah mengembangkan Prices-IDE, yaitu sebuah integrated development environment (IDE) yang menghasilkan aplikasi web menggunakan paradigma SPLE. Aplikasi web tersebut dihasilkan secara otomatis (generated) menggunakan plugin UI Generator pada PRICES-IDE yang menerima model interaction flow modeling language (IFML) untuk dihasilkan menjadi aplikasi React. Aplikasi yang dihasilkan secara otomatis tersebut belum memiliki user interface (UI) yang dapat dikustomisasi secara lengkap. Penelitian sebelumnya telah berhasil mengembangkan mekanisme kustomisasi tema warna pada aplikasi. Namun, mekanisme kustomisasi tersebut belum dapat dilakukan pada aspek UI lainnya, seperti layout halaman dan bentuk komponen. Penelitian ini mengusulkan mekanisme kustomisasi UI yang terintegrasi pada Prices-IDE dengan menyediakan variasi template UI yang adaptif dengan fitur aplikasi. Mekanisme kustomisasi UI dilakukan dengan memvariasikan kode template projek React yang digunakan serta memvariasikan aturan code generator yang digunakan dalam UI Generator. Variasi tersebut dipaketkan menjadi pilihan template UI yang dapat dipilih pengguna ketika menggunakan UI Generator. Agar penambahan variasi baru dapat dilakukan dengan mudah, dilakukan refactoring terhadap UI Generator sehingga penambahan variasi baru tidak mengubah kode yang sudah diimplementasi sebelumnya. Hasil implementasi mekanisme kustomisasi kemudian dianalisis dan dievaluasi dengan melakukan studi kasus pada aplikasi Amanah, yaitu sebuah layanan aplikasi untuk menghasilkan aplikasi web bagi organisasi nirlaba. Setelah itu, evaluasi dilakukan menggunakan six quality criteria serta kemudahan untuk menjalankan mekanisme kustomisasi. Berdasarkan hasil studi kasus dan evaluasi, disimpulkan bahwa mekanisme kustomisasi dapat memvariasikan tampilan UI dari fitur aplikasi dan terintegrasi dengan plugin UI Generator dalam Prices-IDE.

---

Software Product Line Engineering (SPLE) serves as a paradigm to develop multiple software variants while optimizing time and costs. Previous researches introduce Prices-IDE, an integrated development environment (IDE) that uses SPLE to automate web application generation via UI Generator plugin. The plugin accepts Interaction Flow Modeling Language (IFML) models as an input to generate React applications. However, these auto-generated applications lack comprehensive User Interface (UI) customization. Although prior studies have already implemented color theme customizations, extending the customization to other UI aspects, such as layout and component structure, has not yet been implemented. This study proposes an integrated UI customization mechanism within Prices-IDE, providing adaptive UI template variations that aligns with generated application features. The mechanism involves providing multiple variations of React project template and diversifying UI Generator’s code generation rules, packaged as selectable options for users. UI Generator is also refactored so that the addition of new variations will not alter existing code. Evaluation is done through case study using Amanah, a service providing web application for non-profit application. UI Generator is also evaluated and analyzed through six quality criteria and usability assessment. This study concludes that the proposed customization mechanism can be used to diversify UI appearance and integrate smoothly with Prices-IDE’s UI Generator."

"Software Product Line Engineering (SPLE) merupakan suatu paradigma dalam pengembangan perangkat lunak yang mampu menghasilkan software secara masif dalam waktu singkat dan dengan biaya yang relatif rendah. Dalam mengembangkan antarmuka menggunakan paradigma SPLE, diperlukan abstraksi untuk memodelkan antarmuka. Teknologi pemodelan yang digunakan dalam penelitian ini adalah Interaction Flow Modeling Language (IFML). Salah satu sistem yang mengadopsi paradigma SPLE adalah Amanah. Amanah adalah aplikasi untuk menghasilkan website organisasi non-profit secara otomatis yang dikembangkan oleh Laboratorium Reliable Software Engineering (RSE) Fakultas Ilmu Komputer Universitas Indonesia menggunakan paradigma SPLE. Aplikasi ini menggunakan UI Generator telah dikembangkan dalam penelitian sebelumnya untuk menerjemahkan IFML menjadi komponen React. Salah satu fitur yang disediakan oleh Amanah adalah fitur donasi. Fitur ini merupakan gerbang utama bagi individu dan organisasi untuk berkontribusi secara finansial. Namun, terdapat kekurangan pada fitur donasi di Amanah yang perlu dikembangkan lebih lanjut, seperti antarmuka yang belum menerapkan mobile-first design. Mobile-first design merupakan pendekatan desain antarmuka yang memprioritaskan tampilan pada perangkat mobile. Dalam beberapa tahun terakhir, mobile-first design semakin banyak diterapkan oleh pembuat web. Hal ini terjadi karena semakin banyaknya orang yang mengakses internet melalui perangkat seluler. Untuk meningkatkan pengalaman pengguna dalam berdonasi di Amanah, diperlukan perubahan pada tampilan donasi yang menerapkan mobile-first design. Saat ini, UI Generator yang dimiliki belum bisa menghasilkan tampilan mobile-first design. Oleh karena itu, dalam penelitian ini ingin dikembangkan fitur donasi dengan memodelkan IFML, mengembangkan UI Generator sehingga dapat menghasilkan tampilan antarmuka menerapkan mobile-first design. Dalam penelitian ini, dilakukan analisis terhadap beberapa website donasi yang telah menerapkan mobile-first design. Kemudian, antarmuka dari hasil pengembangan IFML dan UI Generator dievaluasi menggunakan UX Expert Review, sedangkan untuk fungsionalitas fitur diuji menggunakan functional testing.

---

Software Product Line Engineering (SPLE) is a software development paradigm that allows the massive software production in a short time and at a relatively low cost. In developing aninterface using the SPLE paradigm, abstraction is needed to model the interface. The modeling technology used in this study is the Interaction Flow Modeling Language (IFML). One of the systems that adopts the SPLE paradigm is Amanah. Amanah is an application to automatically generate non-profit organization websites developed by the Reliable Software Engineering Laboratory (RSE) of the Faculty of Computer Science, University of Indonesia using the SPLE paradigm. This application uses the UI Generator that has been developed in previous research to translate IFML into React components. One of the features provided by Amanah is the donation feature. This feature is the main gateway for individuals and organizations to contribute financially. However, there are shortcomings in the donation feature in Amanah that need to be further developed, such as the interface that has not implemented mobile-first design. Mobile-first design is an approach in interface design that prioritizes the appearance on mobile devices. In recent years, Mobile-first design has been increasingly applied by web developers. This is because more and more people are accessing the internet via mobile devices. To improve the user experience in donating at Amanah, changes are needed to the donation display that implements mobile-first design. Currently, the current UI Generator was not able to produce a mobile-first design display. Therefore, in this study, researcher wants to develop a donation feature by modeling IFML, developing a UI Generator so that it is able to produce a mobile-first design display. In this study, benchmarking was conducted on several donation websites that have implemented mobile-first design. Then, the interface from the results of the IFML and UI Generator development was evaluated using UX Expert Review, while the functionality of the feature was tested using functional testing."

"Pengembangan perangkat lunak menggunakan metode Software Product Line Engineering (SPLE) mempunyai banyak manfaat seperti sedikitnya waktu dan biaya yang diperlukan untuk membuat produk perangkat lunak baru. Salah satu web framework yang mendukung pembuatan aplikasi web menggunakan metode SPLE adalah WinVMJ. WinVMJ dirancang berdasarkan pendekatan variability module for java (VMJ) dan delta oriented programming (DOP). WinVMJ menggunakan design pattern decorator pattern dan factory pattern untuk mengimplementasikan pendekatan DOP. WinVMJ merupakan framework yang baru dikembangkan sehingga banyak hal yang bisa ditingkatkan untuk membuat WinVMJ lebih baik. Salah satunya adalah Object-Relational Mapping (ORM) yang digunakan WinVMJ. Saat ini WinVMJ menggunakan ORM yang dibuat sendiri dari awal. Namun ORM ini masih sederhana, objek dari WinVMJ tidak bisa langsung dipetakan ke dalam database. Oleh karena itu penelitian ini bertujuan untuk mengintegrasikan ORM Hibernate dengan framework WinVMJ agar pengolahan data pada WinVMJ dapat dilakukan dengan mudah menggunakan ekspresi object oriented programming. Proses integrasi diawali dengan mendesain strategi pemetaan yang dapat digunakan untuk memetakan objek pada WinVMJ yang dibuat menggunakan decorator pattern. Kemudian merubah tools, script maupun struktur dari WinVMJ agar bisa kompatibel dengan ORM Hibernate. WinVMJ yang sudah diintegrasikan dengan ORM Hibernate diuji dengan mengimplementasikan studi kasus Software Product Line (SPL) Amanah menggunakan WinVMJ. WinVMJ tersebut dapat memenuhi segala keperluan untuk mengimplementasikan studi kasus SPL Amanah dengan baik. Diantaranya adalah keperluan untuk membuat endpoint create, read, update, dan delete (CRUD). Jika dibandingkan dengan framework lain, framework WinVMJ mempunyai fleksibilitas yang lebih tinggi dalam mengakomodasi berbagai macam requirement dan varian yang ada pada SPL.

---

Software development using Software Product Line Engineering (SPLE) method has many benefits, such as less time and money needed to create a new software product. One of the web frameworks that support the creation of web applications using SPLE method is WinVMJ. WinVMJ is designed based on the Variability Modules for Java (VMJ) and Delta-Oriented Programming (DOP) approach approaches. WinVMJ uses decorator pattern and factory pattern to implement the DOP approach. WinVMJ is a newly developed framework so many things could be improved to make WinVMJ better. For example, the Object-Relational Mapping (ORM) used by WinVMJ. Currently, WinVMJ uses an ORM built from scratch. However, this ORM is still primal, WinVMJ objects can’t be directly mapped into the databases. Therefore, this research aims to integrate Hibernate ORM with the WinVMJ framework so that data processing on WinVMJ can be done easily using object-oriented programming expressions. The integration process begins with designing a mapping strategy that can be used to map WinVMJ objects created using decorator pattern. Then change the tools, scripts, and structures of WinVMJ to be compatible with Hibernate ORM. The newly modified WinVMJ then tested by implementing the Amanah Software Product Line (SPL) case study using WinVMJ. The newly modified WinVMJ can meet all the needs to properly implement the SPL Amanah case study. Among them is the need to construct create, read, update, and delete (CRUD) endpoints. Compared to other frameworks, the WinVMJ framework has higher flexibility in accommodating various requirements and variants that exist in the SPL."