Progdas BAB 6 Pembuatan User Interface dan Struktur Kontrol dalam Aplikasi

 Pembuatan User Interface dan Struktur Kontrol dalam Aplikasi

A. Implementasi User Interface pada Aplikasi

Tujuan utama dari desain antarmuka adalah menghasilkan sistem komputer yang mampu digunakan dengan baik oleh pengguna (good usability) dengan memperhatikan beberapa hal penting seperti memahami faktor-faktor dalam menggunakan teknologi, mengembangkan teknik untuk membangun sistem yang sesuai dengan tujuan serta mencapai interaksi yang aman, efektif, dan efisien. Dengan demikian, rekayasa bentuk user interface sebagai proses yang kompleks dan memerlukan daya kreativitas yang tinggi, pengalaman, analisis terperinci dan pemahaman terhadap kebutuhan user. User interface dapat diatur menggunakan pilihan dari pembuat komputer, analisis sistem, pemrograman ataupun oleh user yang bersangkutan.

1. Desain Interface (Antarmuka) dalam C++

Program yang dihasilkan dari aplikasi C++ masih berbasis teks, sehingga dalam membuat desain interface dilakukan dengan memanipulasi tata letak, animasi, penggunaan warna, penggunaan kode ASCII, dan lain-lain. Sebuah desain interface yang baik harus membuat sebuah program nyaman digunakan (user friendly). Pembuatan desain interface harus dilihat dari berbagai macam aspek, di antaranya aspek pengguna dan kemudahan dalam memahami sebuah program.

a. Manipulasi Tata Letak

Beberapa kode/perintah yang bisa digunakan dalam memanipulasi tata letak text antara lain:

1) setw(lebar_layar)

Digunakan untuk mengatur lebar layar sebuah text, untuk perintah setw() perlu pemanggilan file header #include <iomanip.h>

2) gotoxy(jml_baris, jml_kolom)

Perintah yang digunakan untuk memposisikan text/karakter dalam koordinat x dan y, di mana x merupakan jumlah kolom dan y merupakan jumlah baris.

b. Animasi

Animasi dalam C++ dapat dilakukan dengan perintah Sleep(waktu_tunda). Perintah Sleep ini berarti menunda text/karakter yang akan ditampilkan sesuai dengan waktu yang ditentukan programmer. Penggunaan perintah Sleep memerlukan file header "#include <windows.h>". Hal yang perlu diingat adalah penulisan Sleep harus menggunakan huruf S besar.

c. Penggunaan Warna

Sebuah program akan lebih menarik, jika mampu memberikan warna untuk teks dan background. Warna default yang digunakan untuk membuat sebuah program dengan C++ adalah text putih dan background hitam. Cara yang paling,Mudah adalah dengan syntax: system ("color kodewarna"); serta membutuhkan file header "#include <stdlib.h>". Misalnya: system("color 76"); yang artinya kode pertama 7 adalah warna background, dan kode ke dua 6 adalah warna text, sehingga dalam kode 76 akan menampilkan background putih dan text kuning. Selain itu bisa menggunakan setcolor(kode_warna).

2. Pembuatan Desain User Interface

Desain User Interface (UI) berfokus pada perencanaan berbagai unsur-unsur yang digunakan pada antarmuka dengan tujuan memudahkan untuk diakses, dipahami, dan digunakan oleh user. UI menyatukan konsep dari interaction design, visual design, dan information architecture. Standar desain user interface telah dikembangkan sejak tahun 1980-an untuk menentukan kegunaan dari produk piranti lunak. Salah satu basis struktural telah menjadi model referensi antarmuka pengguna adalah IFIP (International Federation of Information Processing) yang mengusulkan empat dimensi untuk struktur antarmuka, yaitu dimensi input/output, dimensi dialog, dimensi fungsional/teknis, dan dimensi organisasi.

a. Memilih Interface Elements

User lebih terbiasa dengan elemen interface yang bekerja dengan cara tertentu, sehingga perlu konsistensi dalam membuat struktur pilihan dan tata letaknya. Hal tersebut justru membantu dalam penyelesaian tugas, efisiensi, dan menambah kepuasan user.

b. Merancang interface

Mengetahui sifat user mencakup pemahaman, tujuan, skill, preferensi, dan kecenderungan pemilihan elemen. Beberapa hal yang perlu dipertimbangkan saat merancang interface adalah: 

1) Membuat konsistensi dan menggunakan elemen UI umum agar user merasa nyaman. 

2) Menjaga antarmuka tetap sederhana dan terstruktur jelas. 

3) Menggunakan strategi warna dan tekstur untuk menarik perhatian. 

4) Mempertimbangkan tata letak halaman berdasarkan tujuan. 

5) Menggunakan tipografi untuk meningkatkan kejelasan. 

6) Memikirkan tentang default untuk menghindari kesalahan user. 

7) Memastikan sistem memberi informasi terkini tentang lokasi dan tindakan.

B. Struktur Kontrol dalam Aplikasi

Struktur kontrol percabangan identik dengan algoritma yang memiliki suatu kondisi tertentu akan menentukan perintah-perintah yang dijalankan oleh program. Perintah dalam sebuah kondisi (condition) akan dijalankan ketika kondisi tersebut bernilai benar, dan begitu juga sebaliknya.

1. Kerangka Kode Program dalam C++

Bahasa C++ dikembangkan pertama kali oleh Bjarne Stroustrup dari Bell Labs pada awal 1980-an. Guna mendukung fitur-fitur pada C++ dibangun efisiensi dan sistem support untuk pemrograman tingkat rendah (low level coding) serta menambahkan konsep baru seperti class dengan sifat-sifatnya seperti inheritance dan overloading. Setiap program yang ditulis dalam bahasa C++ pasti akan memiliki sebuah fungsi utama dengan nama main(). Selanjutnya jika ingin mendefinisikan

a. Program C++ Prepocessor

Pada pembentukan program yang ditulis dalam C++, pada awalnya kode program akan diproses oleh program C++ Prepocessor. Program ini akan menggabungkan kode program dengan prepocessor directive yang digunakan di dalam kode. Prepocessor directive adalah statement program yang diawali dengan tanda #. Pada tahap ini, statement #include, #define, dan lain-lain akan diubah ke dalam bentuk kode aktual. Sebagai contoh apabila di dalam kode program terdapat statement #include maka seluruh isi dari file "iostream" akan dimasukkan ke dalam kode program. Pada tahap berikutnya, kode yang telah diperluas tersebut dikirim ke program C++ Compiler.

b. Program C++ Compiler

Tahap berikutnya setelah tahap pemrosesan awal kode program adalah tahap penerjemahan kode program menjadi kode assembly. Proses pada tahap ini dilakukan oleh program C++ Compiler. Kode yang sudah berubah ke bentuk kode assembly kemudian siap dikirim ke program Assembler.

c. Program Assembler

Setelah kode assembly dari C++ Compiler, program langsung menerjemahkan kode-kode tersebut ke dalam bentuk kode objek. Pada tahap selanjutnya, kode objek tersebut dikirim ke program Linker.

d. Program Linker

Apabila kode program yang kita tulis lebih dari satu file, maka kode objek yang dihasilkan juga akan sesuai dengan jumlah file kode program. Pada tahap ini, program Linker akan menghubungkan semua file kode objek tersebut dengan Standard Runtime Library yang sudah disediakan oleh C++ kemudian mengubahnya ke dalam satu file .exe (atau .o). File inilah yang dinamakan program.

e. Program Loader

Program Loader digunakan untuk mengeksekusi program yang sudah dibuat sebelumnya. Misalnya, dalam aplikasi Dev-C++ (program IDE dan C/C++ Compiler). Ketika menggunakan menu Compile, maka Dev-C++ akan melakukan proses pembentukan program dengan memanggil (call) program C++ Prepocessor, Compiler, Assembler, dan Linker. Namun pada saat menggunakan menu Run, maka program Loader akan dipanggil untuk mengeksekusi program yang telah kita buat sehingga hasil (output) program akan ditampilkan di layar monitor (console).