DESAIN GRAFIS

Bab I

(Sejarah, Prinsip, dan Profesi dalam Desain Grafis)

Desain grafis adalah suatu bentuk komunikasi visual yang menggunakan gambar untuk menyampaikan informasi atau pesan seefektif mungkin. Dalam desain grafis, teks juga dianggap gambar karena merupakan hasil abstraksi simbol-simbol yang bisa dibunyikan. Desain grafis diterapkan dalam desain komunikasi dan fine art. Desain grafis juga didefinisikan sebagai salah satu bentuk seni lukis (gambar) terapan yang memberikan kebebasan kepada sang desainer (perancang) untuk memilih, menciptakan, atau mengatur elemen rupa seperti ilustrasi, foto, tulisan, dan garis di atas suatu permukaan dengan tujuan untuk diproduksi dan dikomunikasikan sebagai sebuah pesan. Desain grafis umumnya diterapkan dalam dunia periklanan, packaging, perfilman, dan lain-lain.

· Sejarah Desain Grafis

Sejarah desain grafis jelas terlihat dari jejak peninggalan manusia dalam bentuk lambang-lambang grafis yang berwujud gambar atau tulisan. Gambar mendahului tulisan karena gambar dianggap lebih bersifat langsung dan ekspresif, dengan dasar acuan alam (flora, fauna, dan lain-lain).

Tulisan/aksara merupakan hasil konversi gambar, bentuk dan aturan komunikasinya lebih rumit dibandingkan gambar. Manusia melakukan komunikasi menggunakan gambar sekitar pada zaman manusia primitif, mereka menggunakan coretan-coretan pada dinding gua untuk keiatan berburu binatang.

Desain grafis berkembang pesat seiring dengan perkembangan sejarah peradaban manusia saat ditemukannya tulisan dan mesin cetak. Pada tahun 1447, Johannes Gutenberg (1398-1468) menemukan teknologi mesin cetak yang bisa digerakkan dengan model tekanan menyerupai desain yang digunakan di Rhineland, Jerman, untuk menghasilkan anggur. Ini merupakan suatu pengembangan revolusioner yang memungkinkan produksi buku secara massal dengan biaya rendah, yang menjadi bagian dari ledakan informasi pada masa kebangkitan kembali Eropa.

Tahun 1450 Guterberg bekerjasama dengan pedagang Johannes Fust, dibantu oleh Peter Schoffer ia mencetak “Latin Bible”. Temuan Gutenberg tersebut telah mendukung perkembangan seni ilustrasi di Jerman terutama untuk hiasan buku. Pada masa itu berkembang corak huruf dan cenderung realis dan tidak banyak icon.

Setelah ditemukannya tulisan dan mesin cetak, desain grafis mengalami perkembangan pesat. Kejayaan kerajaan Romawi di abad pertama telah membawa peradaban baru dalam sejarah peradaban Barat dengan diadaptasikannya kesusasteraan, kesenian, agama, serta alfabet latin yang dibawa dari Yunani.

Kemudian dengan adanya mesin cetak dan komputer pada saat ini juga merupakan dua hal yang secara signifikan mempercepat perkembangan penggunaan seni desain grafis hingga akhirnya diterapkan dalam

dunia periklanan, packaging, perfilman, dan lain-lain.

· Prinsip Desain Grafis

1. Kesatuan (Unity)

Kesatuan merupakan salah satu prinsip dasar desain grafis yang sangat penting. Tidak adanya kesatuan dalam sebuah karya desain akan membuat karya tersebut terlihat bercerai-berai atau kacau-balau berantakan yang mengakibatkan karya tersebut tidak nyaman dipandang. Prinsip ini sesungguhnya adalah prinsip hubungan, jika salah satu atau beberapa unsur rupa mempunyai hubungan (warna, raut, arah dan lain-lain), maka kesatuan tersebut telah tercapai.

2. Keseimbangan (Balance)

Sebuah karya desain harus memiliki keseimbangan agar nyaman dipandang dan mudah difahami serta tidak membuat gelisah. Dalam bidang desain dan seni, keseimbangan tidak dapat diukur tapi dapat dirasakan, yaitu suatu keadaan dimana semua bagian sebuah karya tidak ada yang saling membebani. Ada dua pedekatan dasar dalam prinsip keseimbangan, pertama adalah keseimbangan simetris yang merupakan susunan dari elemen agar merata ke kiri dan kanan dari pusat. Kedua adalah keseimbangan asimetris yang merupakan pengaturan yang berbeda dengan berat benda yang sama di setiap sisi halaman. Warna, ukuran, bentuk dan tekstur dapat digunakan sebagai unsur balancing.

3. Proporsi (Proportion)

Proporsi termasuk prinsip dasar desain untuk memperoleh keserasian sebuah karya, diperlukan perbandingan-perbandingan yang tepat untuk menghasilkan desain yang serasi. Pada dasarnya, proporsi adalah perbandingan matematis dalam sebuah bidang. Proporsi Agung (The Golden Mean) adalah proporsi yang paling populer dipakai hingga saat ini dalam karya seni rupa hingga karya arsitektur. Dalam bidang desain, semua unsur berperan menentukan proporsi, seperti hadirnya warna cerah yang diletakkan pada bidang/ruang sempit. Proporsi dapan dijangkau dengan menunjukkan hubungan antara Suatu elemen dengan elemen lain.

4. Irama (Rhythm)

Irama adalah pengulangan gerak yang teratur dan terus menerus. Dalam bentuk-bentuk alah bisa kita ambil contoh pengulangan gerak pada ombak laut, barisan semut, gerak dedauan, dan lain-lain. Prinsip irama sesungguhnya adalah hubungan pengulangan dan bentuk-bentuk unsur-unsur rupa. Pengulangan (mengulangi unsur serupa ddengan cara yang konsisten) dan variasi (perubahan dalam bentuk, ukuran, posisi atau elemen) adalah kunci untuk menciptakan visual ritme.

5. Dominasi (Domination)

Dominasi merupakan salah satu prinsip dasar tatarupa yang harus ada dalam sebuah karya seni dan desain. Dominasi berasal dari kata Dominance yang berarti keunggulan, sifat unggul dan istimewa ini menjadikan suatu unsur sebagai penarik dan pusat perhatian. Dalam dunia desain, dominasi sering juga disebut Conter Of Interest, Focal Point dan Eye Catcher. Dominasi mempunyai bebera tujuan, yaitu untuk menarik perhatian, menghilangkan kebosanan, dan untuk memecah keberaturan, biasanya ditengarahi dengan emphasis.

· Profesi dalam bidang Desain Grafis

1. Ilustrator

2. Graphic desaign ( Perancang grafis)

3. interior designer (Perancang Interior)

4. Fashion designer (Perancang Busana)

5. Art/Creative Director

6. Product Designer (Perancang Produk)

7. UI/UX Designer

8. Game Designer

9. Komikus

10. Animator

Bab 2 & 3

( Elemen, Prinsip Dasar, Konsep Skala, Rasio Matematika, System Proporsional, Ilusi dan Manipulasi, serta Jenis Tipografi dalam Desain grafik)

· Elemen-elemen dasar desain grafik

1. Garis (Line)

Garis adalah sebuah unsur desain yang menghubungkan antara satu titik dengan titik lainnya sehingga tergambarlah sebuah garis dengan bentuk lengkung (curve) atau lurus (straight). Mampu membuat keteraturan, mengarahkan pandangan dan memberikan kesan bergerak serta memiliki karakter tertentu. Penggunaan garis dapat diaplikasikan dalam pembuatan grafik atau bagan.

2. Bentuk (Shape)

Bentuk adalah seperangkat garis yang ditempatkan berdekatan, memiliki diameter, tinggi dan lebar. Ini merupakan obyek 2 (dua) dimensi. Berdasarkan sifatnya, bentuk dapat dikategorikan menjadi tiga, yaitu huruf, simbol, dan bentuk nyata (form). Selain itu hal ini dapat digunakan sebagai perantara sebuah ide.

3. Tekstur (Texture)

Tekstur merupakan sebuah visualisasi dari permukaan yang dapat dinilai dengan cara dilihat atau diraba. Pada prakteknya, tekstur sering dikategorikan sebagai corak dari suatu permukaan benda. Tekstur dapat menambah dimensi dan kekayaan sebuah layout, menegaskan atau membawa ke dalam sebuah rasa/emosi tertentu.

4. Warna

Warna merupakan media paling akhir dalam komunikasi simbolik dan yang terpenting.Nyatanya, warna dibagi ke dalam dua section, warna yang timbul karena sinar (RGB) dan warna yang dibuat dalam unsur tinta atau cat (CMYK). Dengan warna si desainer dapat menampilkan identitas, menyampaikan pesan atau menarik perhatian serta menegaskan sesuatu.

· PRINSIP DESAIN GRAFIS

Pesan visual harus kreatif (asli, inovatif dan lancar), komunikatif, efisien dan efektif, sekaligus indah/estetis. Berbeda dengan prinsip desain grafis. Dalam ilmu desain grafis, selain prinsip-prinsip diatas ada beberapa prinsip utama komunikasi visual dari sebuah karya desain.

- Ruang Kosong (White Space)

Ruang kosong dimaksudkan agar karya tidak terlalu padat dalam penempatannya pada sebuah bidang dan menjadikan sebuah obyek menjadi dominan.

- Kejelasan (Clarity)
Kejelasan atau clarity mempengaruhi penafsiran penonton akan sebuah karya. Bagaimana sebuah karya tersebut dapat mudah dimengerti dan tidak menimbulkan ambigu/ makna ganda.

- Kesederhanaan (Simplicity)
Kesederhanaan menuntut penciptaan karya yang tidak lebih dan tidak kurang. Kesederhanaan seing juga diartikan tepat dan tidak berlebihan. Pencapaian kesederhanaan mendorong penikmat untuk menatap lama dan tidak merasa jenuh.

- Emphasis (Point of Interest)

Emphasis atau disebut juga pusat perhatian, merupakan pengembangan dominasi yang bertujuan untuk menonjolkan salah satu unsur sebagai pusat perhatian sehingga mencapai nilai artistic.

· Skala

Skala dalam Prinsip Desain Grafis dapat diartikan sebagai perubahan ukuran/size tanpa perubahan ukuran panjang lebar atau tinggi. Proporsi dalam prinsip desain grafis merupakan perubahan perbandingan antara panjang lebar atau tinggi sehingga gambar dengan perubahan proporsi sering terlihat distorsi.

· Rasio

- Rasio bisa diartikan sama dengan ‘’ di banding dengan ‘’

- Rasio merupakan perbandingan antara 2 kuantitas yaitu kuantitas pembilang dan kuantitas penyebut

- Kedua kuantitas tersebut dibandingkan tidak harus memiliki sifat / ciri yang sama

- Rasio juga bisa di artikan sebagai frekuensi relatif dari suatu sifat tertentu dibandingkan dengan frekuensi dari sifat lain.

‘’ rasio = kuantitas numerator / kuantitas denaminator ‘’

Contoh:

Dalam suatu kejadian KLB penyakit Diare jumlah penderita laki-laki sebanyak 1200 orang dan jumlah perempuan sebanyak 60 orang di kecematan luwuk timur

Rasio = 120 : 60 = 2 : 1

· Proporsi

- Bentuk khusus dalam perhitungan rasio adalah proporsi

- Proporsi = pembilang merupakan bagian dari penyebut

- Proporsi artinya jumlah / frekuensi dari suatu sifat tertentu di bandingkan dengan seluruh populasi dimana sifat tersebut didapatkan.

- Rumusan dari proporsi yaitu : X / ( X + Y )

Contoh

Dari kejadian KLB Busung Lapar jumlah penderita laki-laki sebanyak 70 orang dan jumlah perempuan sebanyak 10 orang

Proporsi = 70 / ( 70 + 10 ) X 100% = 87,5%

- Proporsi dapat dinyatakan dalam bentuk presentase sehingga nilai proporsi adalah :

‘’ 0 < Proporsi <1 atau 0 % < Proporsi < 100% ‘’

· Ilusi dan manipulasi ruang grafik

Manipulasi foto adalah aplikasi editing gambar teknik untuk foto-foto dalam rangka menciptakan ilusi atau penipuan (berbeda dengan tambahan belaka atau koreksi), melalui cara-cara analog atau digital. Dalam digital editing, foto-foto biasanya diambil dengan kamera digital dan masukan langsung ke komputer. Transparansi, negatif atau foto dicetak juga dapat didigitalkan menggunakan scanner, atau gambar dapat diperoleh dari database stok fotografi. Dengan munculnya komputer, tablet grafis, dan kamera digital, mengedit gambar jangka mencakup segala sesuatu yang dapat dilakukan untuk foto, baik dalam ruang gelap atau di komputer. Manipulasi foto seringkali jauh lebih eksplisit daripada perubahan halus untuk keseimbangan warna atau kontras dan mungkin melibatkan overlay kepala ke tubuh yang berbeda atau mengubah teks tanda, misalnya. Editing gambar perangkat lunak dapat digunakan untuk menerapkan efek dan merubah komponen gambar sampai hasil yang diinginkan tercapai.

Gambar yang dihasilkan mungkin memiliki sedikit kemiripan atau tidak ke foto (atau foto dalam kasus composite) dari mana ia berasal. Hari ini, manipulasi foto secara luas diterima sebagai bentuk seni.

· TIPOGRAFI

Tipografi adalah seni tentang aturan atau tata cara penggunaan huruf, kata, paragraf pada ruang – ruang yang tersedia untuk menciptakan kesan – kesan tertentu sehingga dapat menolong para pembaca agar lebih nyaman dan maksimal dalam membaca.

Jenis-jenis huruf Tipografi secara umum :

1. Serif ( Berkaki )

Serif ( Berkaki ) adalah jenis huruf tipografi yang memiliki kaki pada setiap ujungnya.

2. Sans Serif ( Tidak Berkaki )

Sans Serif ( Tidak Berkaki ) adalah jenis huruf tipografi yang tidak memiliki kaki pada setiap ujungnya.

3. Script ( Tulisan Tangan )

Script ( Tulisan Tangan ) adalah jenis huruf tipografi berupa tulisan tangan biasanya huruf miring ke kanan dan ada penekanan seperti menggunakan pena atau kuas.

Tipografi dalam Web Design

Tipografi dalam Web Design sangatlah penting dimana tipografi adalah salah satu unsur wajib yang harus dikuasai oleh seorang web designer.

Jenis huruf Tipografi yang biasanya digunakan dalam Web Design adalah jenis huruf Tipografi Sans Serif ( Tidak Berkaki ) seperti Arial, Verdana, Tahoma dimana jenis huruf Sans Serif ini memiliki keunggulan dalam segi visual yaitu mudah di baca dalam resolusi kecil maupun besar sehingga mudah untuk beadaptasi dengan mata dan dan daya ingat si pembaca.

Tetapi setelah perkembangan teknologi yang begitu pesat tidak hanya huruf Sans Serif saja yang digunakan dalam kancah Web Design tetapi jenis huruf Serif pun ada ini dikarenakan telah munculnya monitor – monitor komputer dengan kemampuan resolusi yang tinggi sehingga jenis huruf Serif dapat terbaca dengan baik dengan syarat memiliki ukuran 12 keatas.

Tipografi dalam Web Design tidak hanya mencakup pada jenis font itu sendiri tetapi juga pada unsur – unsur seperti warna, ukuran huruf, serta aksen ( Bold,Italic,Underline,Strikeout).

Warna huruf haruslah terlihat lebih terang dari pada warna latar atau background agar huruf tersebut dapat dibaca dengan baik dan jelas selain itu ukuran huruf juga harus disesuaikan misal huruf pada Heading memiliki ukuran 24 px, body 14 px, footer 12 px itu akan cocok dan website pun menjadi lebih menarik untuk dilihat dan dibaca oleh para pengunjung.

Bab 4

(Proses dan Teknik dalam mendesain model grafik)

· KONSEP DALAM BERPIKIR

Di dalam berpikir ada sebuah konsep yang menggunakan simbol-simbol atau gambaran-gambaran, kata-kata, pengertian-pengertian, yang ada dalam ingatan khususnya ingatan yang berkaitan dengan long term memory. Pengertian atau konsep merupakan konstruksi kejadian, misalnya, pengertian manusia, marah, segi tiga belajar, dan sebagainya. Dengan kemampuan manusia untuk membentuk konsep atau pengertian memungkinkan manusia untuk mengadakan klasifikasi atau penggolongan. Yang merah dan yang bukan merah, dapat menggolongkan manusia dan bukan manusia dan demikian juga yang lain. karena itu konsep atau pengertian merupakan alat (tool) yang baik atau cepat (convenient) dalam berpikir atau problem solving.

Dalam pengertian atau konsep didapati beberapa macam konsep yaitu:

1. Konsep-konsep atau pengertian-pengertian yang sederhana.

2. Konsep-konsep yang komplek.

Pengertian sederhana merupakan pengertian yang dibatasi oleh ciri-ciri atau atribut tunggal misalnya marah. Namun justru banyak pengertian atau konsep yang menggunakan dalam berpikir dibatasi oleh ciri yang tidak tunggal. Ini yang dimaksud dengan konsep komplek di samping itu ada yang disebut dengan konsep konjugatif, konsep ini merupakan konsep yang dibatasi adanya kaitan (joint) dua atau lebih sifat atau ciri yang membentuk konsep tersebut. misalnya zebra merupakan binatang menyusui seperti kuda, tetapi loreng. Konsep disjungtif merupakan konsep yang dibatasi dengan tiap ciri atau sifat yang membawa obyek dalam kelas dari konsep. Misalnya transport dapat kuda, dapat truk, dapat becak dan sebagainya. di samping itu juga ada konsep relational, yaitu konsep atau pengertian yang mempunyai pengertian yang mempunyai kaitan dengan pengertian yang lain.

· KONSEP PEMECAHAN MASALAH ATAU PROBLEM SOLVING

Apa yang dimaksud dengan problem. Problem solving ini timbul apabila ada perbedaan atau konflik antara keadaan satu dengan yang lain dalam rangka untuk mencapai tujuan. Atau juga sering dikemukakan apabila ada kesenjangan antara satu dengan yang lain. Contoh: di muka menggambarkan adanya problem yang harus dipecahkan oleh seorang mahasiswa yang mendapatkan tugas dari dosennya. Mahasiswa yang mendapat problem itu akan berpikir untuk mencari pemecahannya, dengan demikian dapat dikemukakan bahwa dalam problem solving itu adalah directed, yaitu mencari pemecahan dan dipicu untuk mencapai pemecahnya tersebut.

Dalam mencari pemecahan terhadap problem solving itu ada kaidah atau aturan (rules) yang akan membawa seseorang kepada pemecahan masalah tersebut. aturan ini akan memberikan petunjuk untuk memecahkan masalah banyak aturan atau kaidah dalam memecahkan masalah.

· PROSES DESAIN GRAFIS

a. Orientasi/pengumpulan materi, sikap dan tingkah laku seseorang merupakan suatu konsep yang dapat menciptakan harmoni dalam bekerja dan sehingga dapat menyebabkan peningkatan kinerja karyawan secara individu dalam sebuah perusahaan.

b. Pengertian Analisis adalah aktivitas yang terdiri dari serangkaian kegiatan seperti, mengurai, membedakan, memilah sesuatu untuk dikelompokkan kembali menurut kriteria tertentu dan kemudian dicari kaitannya lalu ditafsirkan maknanya.

c. Desain kasar, Yang dimaksud desain kasar adalah dimana desain yang dibuat berstektur kasar.

d. Desain Konseptual adalah menghasilkan beberapa sistem kon-septual alternatif yang telah diidentifikasi selama analisis sistem. Dengan menyajikan sejumlah alternatif yang masuk akal, profesional sistem terhindar dari batasan-batas-an yang sudah diduga sebelumnya pada sistem baru. Pemakai akan mengevaluasi dan menetapkan alternatif.

e. Definisi implementasi adalah suatu hal yang bermuara pada aksi,aktivitas,tindakan serta adanya mekanisme dari suatu sistem. Implementasi tidak hanya sekedar aktivitas monoton belaka,tetapi merupakan kegiatan yang terencana secara baik yang baik untuk mencapai suatu tujuan.

Bab 5

(Kebutuhan pengguna terhadap grafis)

Dalam bidang yang satu ini penggunaan Desain Pemodelan Grafis sangat berguna misal saja pada setiap acara televisi, sekarang ini sudah hampir semuanya menggunakkan desain grafis. Mulai dari iklan, ftv, sampai film sekalipun supaya jauh lebih menarik.

Pemecahan masalah/ kasus secara detail :

a. Memahami masalah (understand the problem)

Tahap pertama pada penyelesaian masalah adalah memahami soal. Siswa perlu mengidentifikasi apa yang diketahui, apa saja yang ada, jumlah, hubungan dan nilai-nilai yang terkait serta apa yang sedang mereka cari. Beberapa saran yang dapat membantu siswa dalam memahami masalah yang kompleks:

(1) memberikan pertanyaan mengenai apa yang diketahui dan dicari

(2) menjelaskan masalah sesuai dengan kalimat sendiri

(3) menghubungkannya dengan masalah lain yang serupa

(4) fokus pada bagian yang penting dari masalah tersebut

(5) mengembangkan model

(6) menggambar diagram.

b. Membuat rencana (devise a plan)

Siswa perlu mengidentifikasi operasi yang terlibat serta strategi yang diperlukan untuk menyelesaikan masalah yang diberikan. Hal ini bisa dilakukan siswa dengan cara seperti:

(1) menebak,

(2) mengembangkan sebuah model,

(3) mensketsa diagram,

(4) menyederhanakan masalah,

(5) mengidentifikasi pola,

(6) membuat tabel,

(7) eksperimen dan simulasi,

(8) bekerja terbalik,

(9) menguji semua kemungkinan,

(10) mengidentifikasi sub-tujuan,

(11) membuat analogi, dan

(12) mengurutkan data/informasi.

c. Melaksanakan rencana (carry out the plan)

Apa yang diterapkan jelaslah tergantung pada apa yang telah direncanakan sebelumnya dan juga termasuk hal-hal berikut:

(1) mengartikan informasi yang diberikan ke dalam bentuk matematika

(2) melaksanakan strategi selama proses dan perhitungan yang berlangsung. Secara umum pada tahap ini siswa perlu mempertahankan rencana yang sudah dipilih. Jika semisal rencana tersebut tidak bisa terlaksana, maka siswa dapat memilih cara atau rencana lain.

d. Melihat kembali (looking back)

Aspek-aspek berikut perlu diperhatikan ketika mengecek kembali langkah-langkah yang sebelumnya terlibat dalam menyelesaikan masalah, yaitu: (1) mengecek kembali semua informasi yang penting yang telah teridentifikasi; (2) mengecek semua perhitungan yang sudah terlibat; (3) mempertimbangkan apakah solusinya logis; (4) melihat alternatif penyelesaian yang lain; dan (5) membaca pertanyaan kembali dan bertanya kepada diri sendiri apakah pertanyaannya sudah benar-benar terjawab.

Bab 6

(mengimplementasikan kebutuhan pengguna ke dalam model desain grafik)

Berikut pembahasan mengenai berbagai jenis software desain grafis yang umumnya digunakan. Desain Grafis berasal dari penggabungan dua kata yaitu desan dan grafis. Masing-masing kata memiliki arti tersendiri, desain adalah proses pembuatan atau pengaturan sesuatu hal yang berhubungan dengan merancang atau merencanakan. Sedangkan grafis adalah cetak mencetak yang sangat berhubungan erat dengan garis. Sehingga desain grafis adalah kombinasi yang selaras antara kalimat, gambar, angka, grafik, foto dan ilustrasi yang membutuhkan kinerja individu untuk menggabungkan efek yang dibutuhkan.

Desain grafis sendiri adalah cabang ilmu yang berasal dari seni desain yang menggunakan bantuan komputer untuk melakukan kegiatan. Orang yang bekerja dalam bidang ini disebut desainer. Desain grafis memiliki berbagai macam software, berikut adalah software desain grafis yang harus anda ketahui:

v Adobe Indesign

Adobe Indesign adalah jenis software desain grafis yang berada dalam perangkat lunak destop publishing atau biasa dikenal dengan nama DTP. Adobe Indesign diproduksi oleh Adobe sistem yang bisa anda gunakan untuk membuat poster, brosur, majalah atau buku. Aplikasi ini banyak digunakan masyarakat luas untuk melakukan suatu desain dalam kehidupan sehari-hari.

v Adobe Page Maker

Adobe Page Maker adalah perangkat lunak aplikasi pengolah data yang digunakan untuk mendesain layout buku, cover majalah atau makalah. Aplikasi ini juga bisa digunakan untuk mendesain koran dan biasa digunakan untuk keperluan undangan, kartu nama, kartu ucapan dan kop surat.

v Adobe Frame Maker

Software Desain Grafis jenis Adobe Frame Maker adalah perangkat lunak yang menggunakan tampilan XML untuk native penulis konten tekstur. Berpaduan dengan PDF yang memiliki konten out-off-the-box integrasi CMS. Aplikasi ini memiliki sistem pempublikasian dengan menggunakan saluran, format dan layanan HTML5 yang menggunakan penerbit server 10 atau Adobe teknis komunikasi Site 4. Aplikasi ini biasa menyimpan data dalam bentuk PDF, HTML, WEbhelp dan Adobe Air.

v Macromedia Freehand

Macromedia Freehand adalah jenis aplikasi software desain grafis yang digunakan untuk melakukan editing gambar berbasis vector. Software ini bisa digunakan oleh para designer untuk melakukan editing logo baik kelompok ataupun perusahaann. Namun software ini juga bisa digunakan untuk melakukan editing pada brosur, kartu nama, undangan dan beberapa kebutuhan lain.

v Adobe Photoshop

Adobe Photoshop adalah software desain grafis yang secara khusus dirancang untuk memanipulasi objek atau gambar yang akan digunakan dalam suatu kepentingan. Aplikasi software desain grafis ini biasa digunakan oleh para photographer untuk mengedit hasil foto agar terlihat lebih hidup dan nyata. Adobe Photoshop adalah produk terbaik yang pernah dikeluarkan oleh Adobe Systems. Anda dapat membuat desain poster, spanduk, logo, dan kebutuhan lainnya dengan Adobe Photoshop.

v Photo Shine

Photo shine adalah jenis aplikasi foto software desain grafis yang biasa digunakan untuk mengabungkan beberapa foto dalam satu frame. Dalam aplikasi ini berbagai macam bingkai juga ditawarkan agar anda bisa memilih bingkai yang anda suka. File penyimpanan foto biasa menggunakan JPG agar gambar mudah disimpan dan dibuka dalam kondisi apapun. Ada beberapa referensi printer cetak foto yang handal untuk Anda gunakan di era sekarang ini.

v Photo Scape

Sama hal nya dengan PhotoShine dan PhotoCollage, Photo Scape adalah Software Desain Grafis yang mendukung anda melakukan editing 2 foto atau lebih. Photo Scape memiliki fitur seperti viewer, efek gambar (sephia, black and white), emoji, tambahan tulisan dan masih bayak fiture yang ada dalam aplikasi Phote Scape. Ada pula fitur untuk membuat animasi gerak dengan menggabungkan minimal 2 layer gambar untuk berganti dengan hitungan detik.

Bab 7

(konsep pemodelan desain grafik pada aplikasi berbasis perangkat bergerak berikut elemen- elemen yang dibutukan untuk membangunnya)

· Konsep resolusi layar pada perangkat bergerak

Ketajaman warna dan detail gambar pada tampilan bitmap bergantung pada banyaknya pixel.

Warna atau resolusi yang membentuk gambar tersebut. Hal ini berkaitan eratdengan kemampuan monitor dan VGA (Video Graphic Adapter ) yang digunakan. Jika gambar tampilan bitmap berresolusi tinggi di tampilkan pada monitor yang berresolusi rendah akan mengakibatkan gambar terlihat kasar , bahkan terlihat kabur berbentuk kotakkotak(juggy) jika dilakukan pembesaran gambar. !atuan untuk ukuran grafis jenis bitmap ini adalah dpi (dot per inch) yang berarti banyaknya titik dalam satu inci. Untuk lebih memahami grafis jenis bitmap.

Beberapa grafis bitmap dapat Anda temui di file komputer, yakni file komputer yang berekstensi: .bmp, .jpg, .tif, .gif, dan .pcx. Grafis ini biasa digunakan untuk kepentingan foto-foto digital.

Program aplikasi grafis yang berbasis bitmap, antara lain: Adobe Photoshop, CorelPhotopaint, Microsoft Photo Editor dan Macromedia FireWorks. Semua program tersebut menawarkan kemudahan dan kelengkapan fiturnya.

· Konsep layout pada apps perangkat bergerak

Layout mendefinisikan struktur visual untuk antarmuka pengguna, seperti UI sebuah aktivitas atau widget aplikasi. Anda dapat mendeklarasikan layout dengan dua cara:

Deklarasikan elemen UI dalam XML. Android menyediakan sebuah kosakata XML sederhana yang sesuai dengan kelas dan subkelas View, seperti halnya untuk widget dan layout.
Buat instance elemen layout saat waktu proses. Aplikasi Anda bisa membuat objek View dan ViewGroup (dan memanipulasi propertinya) lewat program

Layout Linier

LinearLayout adalah sekelompok tampilan yang menyejajarkan semua anak dalam satu arah, secara vertikal atau horizontal. Anda bisa menetapkan arah layout dengan atribut android:orientation.

Semua anak LinearLayout akan ditumpuk satu sama lain, jadi daftar vertikal hanya akan memiliki satu anak per baris, seberapa pun lebarnya, dan daftar horizontal hanya akan setinggi satu baris (tinggi anak yang tertinggi, ditambah pengisi). LinearLayout akan mengikuti margin antara anak dan gravity (sejajar kanan, tengah, atau kiri) setiap anak.

Bobot Layout

LinearLayout juga mendukung penetapan bobot ke masing-masing anak dengan atribut android:layout_weight. Atribut ini menetapkan nilai "penting" ke sebuah tampilan dalam arti seberapa banyak ruang yang akan ditempatinya di layar. Nilai bobot yang lebih besar memungkinkannya diperluas untuk mengisi ruang yang tersisa di tampilan induk. Tampilan anak bisa menetapkan nilai bobot, kemudian ruang yang tersisa dalam kelompok tampilan diberikan ke anak dalam proporsi bobot yang dideklarasikan untuk mereka. Bobot default adalah nol.

Misalnya, jika ada tiga bidang teks dan dua di antaranya mendeklarasikan bobot 1, sementara yang lain tidak diberikan bobot, bidang teks ketiga yang tanpa bobot tidak akan membesar dan hanya akan menempati area yang diperlukan oleh materinya. Dua bidang lainnya akan diperluas secara seimbang untuk mengisi ruang yang tersisa setelah ketiga bidang diukur. Jika bidang ketiga kemudian diberikan bobot 2 (sebagai ganti 0), maka ia kini dideklarasikan lebih penting daripada kedua bidang lainnya, jadi ia mendapatkan setengah jumlah ruang yang tersisa, sedangkan dua yang pertama akan berbagi sisanya secara seimbang.

Anak yang berbobot sama

Untuk membuat layout linier di mana setiap anak menggunakan jumlah ruang yang sama di layar, setel android:layout_height setiap tampilan ke "0dp" (untuk layout vertikal) atau android:layout_width setiap tampilan ke "0dp" (untuk layout horizontal). Kemudian setel android:layout_weight setiap tampilan ke "1".

Konsep tipografi yang sesuai untuk disain grafis apps perangkat bergerak

Desain grafis ternyata bukan sekedar bagaimana memainkan warna dan layout tapi ada satu hal lagi yang perlu diperhatikan yaitu tipografi. Tipografi merupakan komponen paling penting dalam desain grafis yang tidak bisa ditinggalkan. Seorang desainer bertanggung jawab untuk mengetahui seluk-beluk seputar tipografi. Kenapa? Karena dengan begitu ia akan lebih mudah untuk membuat sebuah tipografi yang baik dan berciri khas. Oleh karena itu, desainer yang baik perlu mempelajari peraturan dan pedoman spesifik sehingga dapat mengembangkan kemampuannya dalam membuat tipografi. Dan inilah beberapa aturan dasar dalam seni bertipografi

1. Pelajari Dasarnya

Step yang pertama pastinya banyak belajar tentang tipografi dengan ahlinya, di IDS | International Design School kamu bisa loh belajar dasar tentang tipografi. Nggak hanya tipografi di sini kamu juga akan belajar seputar art & design history, creative drawing, dan masih banyak lagi.

2. Pahami Istilah dan Penggunaan Kerning

Kerning merupakan salah satu unsur yang cukup penting dalam tipografi. Kerning sendiri adalah jarak antar huruf dalam sebuah kata, kalimat, atau paragraf. Jarak antar huruf ini berpengaruh banyak terhadap kemudahan membaca serta keindahan dari kata atau kalimat tersebut. Program seperti Adobe Ilustrator dapat mengatur kerning secara otomatis, optis khusus roman metris, hingga manual. Kerning sangat dibutuhkan apalagi dalam mendesain tipografi.

3. Sesuaikan Jenis Paragraf

Alignment adalah konsep penting dalam tipografi. Banyak orang cenderung memilih antara Center Aligned and Justified yang membuat paragraf cukup sulit dibaca. Dalam MS Word, mungkin kamu sudah terbiasa dengan empat pilihan jenis paragraf yaitu Left Align, Center Aligned, Right Aligned, dan Justified. Paragraf rata kiri (left alignment), alias Flushed Left adalah posisi yang paling umum digunakan dalam segala hal karena lebih enak dilihat mata. Beda lagi dengan paragraf rata kanan (right alignment), alias flushed right adalah teks yang tertata rapi hanya di satu sisi jika disejajarkan dengan benar dan digunakan untuk hal-hal tertentu saja. Sedangkan, justified (paragraf rata kanan dan kiri) jarang sekali digunakan oleh para desainer.

4. Gunakan Grid

Grid adalah alat bantu untuk menyusun atau mengatur objek dalam membuat perencanaan ruang gambar dua dimensi. Bekerja dengan grid memastikan bahwa setiap hal kecil pada halaman tentunya akan menghasilkan keharmonisan logis dan visual.

5. Sesuaikan Warna Font

Saat menyusun font palette, gali teori warna untuk menentukan warna yang tepat dan sesuai untuk desainmu. Misalnya, jeruk diperkirakan menambah nafsu makan, yang menjelaskan mengapa warna tersebut banyak digunakan dalam desain makanan cepat saji. Pastikan warna font kamu tidak terlalu mengganggu sehingga pesan yang mau disampaikan tidak membuat bingung.

6. Pelajari Pengukuran Tipografi

Pengukuran tipografi digunakan untuk menggambarkan lebar keseluruhan blok teks. Pengukuran sangat penting saat mendesain sebuah website. Perlu diperhatikan tidak semua font sama antara satu dengan yang lain. Itu berarti font yang berbeda mengambil ruang yang berbeda pada halaman web. Setiap karakter/font memiliki tinggi yang disebut sebagai “tinggi x”. Saat Anda memasangkan font, pastikan mereka memiliki “tinggi x” yang sama. Sedangkan lebar karakter disebut “set width.” Inilah yang menutupi keseluruhan bodi satu huruf. “Point System” adalah pengaturan yang umumnya digunakan untuk mengukur font.

7. Hindari Menarik Fonts

Ini adalah salah satu aturan yang paling mendasar. Secara umum, font dibuat dengan perhatian cermat pada detail (bentuk dan pengukuran) setiap huruf. Alasan umum orang menarik font untuk membuatnya sedikit lebih tinggi atau lebih lebar. Ada cara untuk melakukan ini tanpa mendistorsi tipenya. Kamu dapat memilih font yang tinggi atau lebar dari persediaan font online yang bisa didapatkan secara gratis atau berbayar.

8. Kombinasikan Jenis Font dengan Tepat

Dalam tipografi menggunakan 2 jenis font yang berbeda menjadi hal yang biasa, asalkan kamu bisa dengan tepat mengkombinasikannya. Namun, menggunakan terlalu banyak font justru membuat tulisan menjadi membingungkan. Secara umum, kamu hanya boleh menggunakan maksimal 3 jenis font desain, yaitu judul, subhead, dan body teks, tapi mendapatkan pengecualian jika teks desain tersebut panjang. Dalam kasus ini, kamu bisa memilih satu atau dua font lagi.

· Format gambar yang dapat disisipkan dalam apps perangkat bergerak

Pengertian Format Gambar adalah suatu representasi spatial dari suatu obyek, dalam pandangan 2D atau 3D.

Format file gambar yang ada saat ini :

- Bitmap (BMP),

- Joint Photographic Expert Group (JPEG/JPG),

- Graphics Interchange Format (GIF),

- Portable Network Graphics (PNG),

- Tagged Image File Format (TIFF),

- Icon (ICO),

- Enchanced Windows Metafile (EMF),

- PCX, ANI (Animation),

- Cursor (CUR),

- WBMP (WAP BMP),

- Adobe Photoshop Document (PSD),

- dan Corel Draw (CDR)

· Konsep warna pada apps perangkat bergerak

Dalam pengolahan image, dikenal dua macam warna paling populer yang menjadi standar internasional, yaitu RGB dan CMYK. RGB adalah singkatan dari Red-Green-Blue (merah, hijau, biru) yaitu warna dasar yang dijadikan patokan warna secara universal (primary colors). Dengan basis RGB, seorang desainer bisa mengubah warna ke dalam kode-kode angka sehingga warna tersebut akan tampil universal.

Dasar warna ini menjadi standar pasti dalam konteks profesional, seorang desainer tidak bisa mengatakan sebuah warna berdasar pertimbangan subektif, contoh, biru muda menurut orang awam adalah birunya langit di siang yang cerah, hal ini bisa jadi berbeda bagi orang lain dengan pertimbangan yang lain pula.

Untuk menyamakan persepsi dalam definisi warna, perlu adanya standar internasional dalam konteks kerja profesional. Dengan standar RGB, seorang desainer dapat mengatakan warna dengan komposisi angka yang jelas, warna biru memiliki komposisi perpaduan antara unsur Red,Green, Blue (merah, hijau, biru) dengan derajat angka untuk R: 115-G : 221-B: 240. Standar warna internasional lainnya yang digunakan untuk dunia percetakan adalah CMYK yang merupakan Singkatan dari Cyan (biru kehijau-hijauan)-Magenta (merah keungu-unguan)-Yellow (kuning), dan K mewakili warna hitam.

Seperti halnya RGB, CMYK menggunakan standardisasi warna dalam koordinat. Rangenya antara 0-100 sehingga kehadiran unsur K sangat menentukan. Berapapun koordinat CMY-nya, selama K-nya 100 maka warna tersebut akan jadi warna hitam. CMYK merupakan standar warna berbasis pigment-based, menyesuaikan diri dengan standar industri printing. Sampai saat ini dunia cetak-mencetak memakai 4 warna dasar dalam membuat warna apapun.

1. Color Wheel (Roda Warna)

Color Wheel merupakan teori dasar warna yang digambarkan dalam bentuk lingkaran (roda). Terdiri dari tiga warna dasar, yaitu merah, biru, dan kuning. Selanjutnya, kombinasi dari tiga warna dasar ini melahirkan warna-warna baru berupa warna sekunder. Warna sekunder terdiri dari Oranye, Ungu dan Hijau. Kombinasi antara warna sekunder dengan warna dasar (primer) melahirkan warna-warna lainnya berupa warna tersier. Warna tersier terdiri dari : kuning-oranye, kuning-hijau, biru-hijau, biru-ungu, merah-ungu, dan merah-oranye. Akhirnya, warna-warna tersebut kemudian digambarkan berupa sebuah lingkaran warna yang kita kenal sekarang dengan istilah Color Wheel.

Beberapa aturan dasar terkait color wheel :

a. Monochromatic Color

Monochromatic Color merupakan perpaduan beberapa warna yang bersumber dari satu warna dengan nilai dan intensitas yang berbeda. Misal : hijau jika dikombinasikan dengan warna hijau dengan nilai dan intensitas yang berbeda akan menciptakan suatu perpaduan yang harmonis dan menciptakan kesatuan yang utuh pada desain.

b. Warna Analog

Warna analog merupakan kombinasi dari warna-warna terdekat. Misal : warna merah akan serasi dengan warna oranye, dan oranye akan terlihat harmonis dengan warna kuning. Begitu juga jika kuning dipadukan dengan hijau atau biru jika dipadukan dengan ungu, dan ungu jika dikombinasikan dengan pink.

c. Warna pelengkap

Beberapa desain butuh sebuah nilai kontras yang cukup untuk menarik perhatian lebih dari pembaca visual. Saat itulah kita menggunakan kombinasi dari warna-warna pelengkap. Misal: biru dan oranye, merah dan hijau, dll.

d. Warna Triad

Teori roda warna diatas menjelaskan bagaimana warna-warna dasar melahirkan berbagai warna baru disekitarnya. Cukup ampuh jika kita ingin bermain dengan variasi warna-warna yang berbeda. Ada banyak sekali kombinasi warna selain warna dasar untuk membuat sebuah desain tampak unik dan berbeda dari biasanya. Misal : Peleburan warna kuning dan oranye, oranye dan merah, merah dan pink (merah muda), pink dan biru, dan seterusnya.

2. Ruang pada Warna

Warna dapat dipengaruhi ruang dan bentuk, sekaligus juga mempengaruhi kesan yang disampaikan pada warna. misalnya, coba berikan warna yang sama pada dua buah bentuk yang berbeda (lingkaran dan garis). Pada lingkaran, warna akan terlihat lebih terang sedangkan pada garis akan terlihat lebih gelap. Hal ini disebabkan besar ruang pada lingkaran lebih luas daripada garis, sehingga mata menangkap sebuah ruang luas dengan asumsi terang, meskipun warna yang diberikan adalah warna yang sama. Ini adalah respon naluriah pada

mata dalam menyikapi suatu kesan pada sebuah visual.

3. Kontras Warna

Kontras pada warna dapat dipengaruhi oleh warna lain disekitarnya. Teorinya sangat sederhana : Kontras = Gelap VS Terang. Misalnya, letakkan sebuah persegi kecil berwarna kuning diatas background berwarna hitam, maka nilai kontras akan meningkat dan persegi berwarna kuning akan dengan mudah terlihat. Sebalinknya, ganti background dengan warna putih, maka nilai kontras akan menurun dan persegi akan sulit untuk dilihat.

4. Psikologi Warna

Warna dapat mewakili karakter dan perasaan-perasaan tertentu. Misal, merah memberi kesan agresif, gairah, panas dan cepat. Hitam memberi kesan misteri, kelam, dan canggih. Dengan mempelajari psikologi warna, kita dapat menyesuaikan desain dengan target yang dituju, komunikasi visual yang efektif, dan membangun suatu kesatuan rasa kepada pembaca visual.

5. Bidang Warna

Garis Outline pada sebuah bidang berfungsi sebagai pembatas warna agar tidak terlihat menyebar keselilingnya. Semakin tipis garis outline yang diberikan, maka semakin tersebar warna ke area luar bidang. Sebaliknya, semakin tebal outline, maka akan semakin tegas warna yang terdapat pada suatu bidang.

· Konsep input pada apps perangkat bergerak

Masukan (input) merupakan awal dimulainya informasi. Bahan mentah dari informasi adalah data yang terjadi dari transaksi yang dilakukan oleh organisasi. Desain input digunakan untuk merancang tampilan layar dikomputer yang menggambarkan bagaimana bentuk pemasukan data.
Proses input melibatkan 3 tahapan utama yaitu :

- Penangkapan Data (Data Capture), Merupakan proses mencatat kejadian nyata yang terjadi akibat transaksi yang dilakukan ke dalam dokumen dasar

- Penyiapan Data (Data Preparation), Yaitu mengubah data yang telah ditangkap kedalam bentuk yang dapat dibaca oleh mesin (Machine Readable Form 1), misalnya kartu plong, pita magnetik/disk magnetick)

- Pemasukan Data (Data Entry), Merupakan proses membacakan atau memasukan data ke dalam komputer

Langkah-langkah Desain Input

Yang perlu didesain secara rinci untuk input adalah bentuk dari dokumen dasar yang digunakan untuk menangkap data, kode-kode input yang digunakan dan bentuk dari tampilan input di alat-alat input. Langkah-langkanya sebagai berikut :

Menentukan kebutuhan input dari sistem baru Input yang akan didesain dapat ditentukan dari DAD sistem baru yang telah dibuat. Input DAD ditunjukan oleh arus data dari suatu kesatuan luar ke suatu proses dan bentuk tampilan input di alat input yang ditunjukan oleh suatu proses pemasukan data
Menentukan parameter dari input

a. Bentuk dari input, dokumen dasar atau bentuk isian di alat input (Dialog layar terminal)
b. Sumber input

c. Jumlah tembusan untuk input berupa dokumen dasar dan distribusinya
d. Alat input yang digunakan

e. Volume input

f. Periode input

· Cara Menngurangi Input sistem

a) Menggunakan kode

b) Data yang relatif konstan disimpan dalam file acuan, gunakan kode untuk mengambil datanya.

c) Jam dan tanggal diambil da

d) Rutin perhitungan dilakukan oleh sistem.

e) Penomoran/pengkodean Otomatis

f) Penggunaan nilai default

g) Input data berdasarkan filter tertentu.

h) Gunakan kontrol pilihan

· Petunjuk Pembuatan Kode

Mudah diingat
Unik
Fleksibel
Konsisten
Standarisasi
Hindari spasi
Hindari karakter yang mirip
Panjang kode sebaiknya sama

· Desain grafis untuk apps perangkat bergerak yang sesuai dengan user experience dan user interface

User Interface Design atau desain UI adalah sebuah desain keseluruhan gaya dan komponen yang ditampilkan di halaman web. Contohnya seperti tata letak dan bentuk desain menu, ikon, warna, gambar, tombol, dan semua komponen lainnya.

Tampilan UI harus menarik, mudah dioperasikan, dan diposisikan dengan pas di laman web. Karena tujuan utamanya adalah untuk memberikan tampilan yang enak dipandang pengguna.

Sedangkan User Experience Design atau desain UX adalah sebuah proses yang komprehensif untuk mengembangkan pengalaman pengguna sebuah produk web. Caranya dengan memaksimalkan step by step yang dilakukan penguna di dalam web tersebut.

Dari sini kamu dapat memberikan pengalaman produk yang hebat saat pengguna berkunjung dan menggunakan situs atau aplikasi rancanganmu. Sejak awal tahun 2019 sampai sekarang, ada beberapa desain antarmuka yang menjadi tren masa kini.

1. Ilustrasi Kreatif

Menggunakan desain ilustrasi memang gak ada matinya deh. Termasuk dalam perancangan UI dan UX. Desain yang simpel, interaktif, dan efektif adalah idaman semua orang bukan?

Ilustrasi menjadi aset visual yang akan diingat oleh pengguna. Bagus untuk menyampaikan citra situs web atau aplikasi buatanmu. Tambahkan ciri khas gaya gambar sebagai signature. Bentuknya bisa gambar manual atau digital seperti vektor dan kartun.

Bukan hanya itu, gaya ini sangat memungkinkan para desainer untuk menyampaikan ide-ide yang rumit tanpa perlu menggunakan terlalu banyak kata. Cukup dari melihat gambar ilustrasi saja pengguna sudah dapat memahami informasi yang kamu sampaikan dalam sekejap.

2. Gradien

Warna-warna gradasi juga sedang menjadi tren masa kini loh. Sebenarnya warna ini sudah populer sejak lama, tapi yang membedakannya adalah pemilihan kombinasi warna.

Di tahun ini, para desainer lebih condong ke warna gradien yang cerah dan mencolok. Kemudian ditambah dengan ilustrasi tebal.

Perpaduan warna neon yang terang dan solid juga bakalan keren banget jika dikombinasikan satu sama lain. Contohnya seperti warna ungu, magenta, oren, tosca, dan lain-lain.

Gaya seperti ini akan meninggalkan kesan yang modern dan eksklusif. Pemilihan warna yang akan digabungkan juga tidak boleh sembarangan, GenK, harus dipertimbangkan matang-matang loh. Ini akan menjadi cerminan situs web atau aplikasi buatanmu.

3. Grafis 3D

Tren berikutnya adalah grafis 3D, baik dalam bentuk desain statis maupun grafik 3D animasi.

Buat kamu yang pernah membuat motion graphic pasti tahu bagaimana konsep dasar dan metode yang digunakan untuk membuat grafis 3D animasi. Prinsipnya hampir sama, GenK.

Hal penting yang mesti kamu perhatikan seperti pergerakan objek, timing, dan kombinasi objek satu dengan objek lainnya.

Ketika semuanya digabungkan, maka akan membentuk komposisi yang mampu menarik perhatian pengguna dan membuat mereka betah untuk berlama-lama di aplikasimu.Kenapa desain 3D bisa bikin betah?

Jawabannya adalah karena bentuknya yang unik (jika statis) dan pergerakannya yang dinamis (jika animasi).

Situs web dengan desain grafis 3D akan lebih mudah dipahami informasinya dibandingkan desain 2D.Hanya saja jika menggunakan desain 3D, kamu harus tetap memastikan kecepatan loading situs web rancanganmu loh.Durasi terbaik adalah 3 detik untuk waktu rata-rata yang pengguna habiskan untuk memutuskan apakah akan tetap tinggal di laman kamu atau malah pergi menjelajah ke situs lain.

4. Augmented Reality

Mendesain virtual akan memberikan pengalam tersendiri buat kamu, salah satunya adalah jenis augmented reality.

Gaya UI UX design yang satu ini memungkinkan kamu sebagai desainer untuk melakukan banyak hal. Seperti mengambil keuntungan dari indera pengguna. Kamu dapat membuat cerita dari sudut pandang orang pertama. Menutupi kenyataan dengan menggunakan objek virtual. Sehingga semua terasa nyata.

Pengguna bisa melihat hal-hal di luar nalar yang tidak akan pernah mereka lihat di dunia nyata. Semuanya bisa kamu desain sendiri, GenK.

5. Hero Image

Pernah gak sih saat kamu berkunjung ke salah satu situs web, pas masuk langsung disambut dengan foto berukuran besar? Ukurannya hampir memenuhi layar laptop kamu, GenK. Mencakup sebagian besar layar, yaitu 25-50% dari total dimensi.

Jenis desain seperti ini disebut hero image.

Hero image adalah gambar yang terpampang secara jelas dengan ukuran yang besar di halaman web. Biasanya diletakkan di bagian depan dan tengah laman. Bentuknya bisa statis maupun bergerak secara dinamis.

Baru datang sudah disuguhkan dengan hero image. Otomatis akan memberikan pengalaman yang berbeda kepada pengguna. Sehingga mereka tertarik untuk mengulik informasi apa saja yang ada di lamanmu.

6. Ukuran Headline yang Besar

Tren yang berikutnya yang mesti kamu cobain adalah ukuran headline yang besar. Alasan kenapa banyak situs web atau aplikasi yang menggunakan gaya ini karena memberi banyak bobot visual pada informasi penting yang ingin kamu sampaikan.

7. Liquid Graphics

Selanjutnya adalah liquid graphics atau bentuk grafik yang mirip seperti cairan. Desain seperti ini memang sedang sering digunakan oleh para desainer.

Bentuknya yang abstrak dengan warna-warna kompleks mampu ditampilkan ke dalam dunia digital. Warna seperti hologram akan memberikan kesan gemerlap dan eksklusif pada suatu desain. Sebenarnya liquid graphics bisa dibuat statis maupun bergerak layaknya air. Keunikan seperti ini pasti ampuh banget untuk menarik minat pengguna. Akan tetapi liquid graphics tidak hanya menyangkut grafis, tetapi juga pemilihan tipografi, GenK.

Gunakan juga warna terang dan solid untuk menuliskan informasi. Supaya pengguna bisa menangkap informasi yang ingin kamu sampaikan.

8. Desain Surealis dan Desain Abstrak

Ada banyak banyak aliran seni rupa. Tak dapat dipungkiri, aliran-aliran ini turut mempengaruhi dunia visual kreatif di luar seni rupa. Contohnya desain surealis dan desain abstrak yang menjadi tren perancangan UI UX 2019 awal.

Kedua desain ini dipakai untuk menggambarkan betapa kompleksnya kehidupan. Keduanya terus berkembang seiring dengan perkembangan digital.

Selain itu, dengan desain seperti ini bisa meninggalkan pengalaman yang membekas kepada pengguna. Di mana sesuatu yang dianggap kuno disajikan dalam bentuk modern.

Tren desain surealis dan desain abstrak sering digabungkan dengan elemen-elemen lain yang memiliki beberapa animasi dan ilustrasi yang sifatnya lucu, salah satunya adalah kartun.

Dari gambar-gambar super unik ini, kamu juga bisa menyiratkan informasi yang kemudian dimaknai oleh pengguna itu sendiri. Penggabungan antara realita dan abstrak memungkinkan koneksi emosional kepada pengguna.

9. Tipografi Antik

Mirip dengan poin sebelumnya, kita mundur lagi ke gaya yang lebih vintage. Tipografi antik kembali menjadi tren perancangan desain pada 2019 awal.

Tulisan dengan huruf serif akan lebih mudah dibaca karena sifatnya to the point. Sehingga informasi lebih mudah disampaikan pada pengguna.

Selain itu, faktor lain yang banyak berkontribusi terhadap tren desain ini adalah resolusi layar yang lebih baik di semua perangkat daripada di masa lalu. Makanya gaya vintage dengan modern cocok digabungkan secara digital.

Pada akhirnya, UI UX adalah sesuatu yang dapat kamu pelajari. Berguna banget sebagai fondasi sebuah situs web atau aplikasi. Gunakan gaya favoritmu. Mau statis ataupun dinamis, keduanya bisa kamu terapkan kok, GenK.

Bab 8

(kebutuhan pengguna terhadap grafik pada aplikasi berbasis perangkat berggerak)

Animasi

Film animasi, atau biasa disingkat animasi saja, adalah film yang merupakan hasil dari pengolahan gambar tangan sehingga menjadi gambar yang bergerak. Pada awal penemuannya, film animasi dibuat dari berlembar-lembar kertas gambar yang kemudian di-"putar" sehingga muncul efek gambar bergerak. Dengan bantuan komputer dan grafika komputer, pembuatan film animasi menjadi sangat mudah dan cepat. Bahkan akhir-akhir ini lebih banyak bermunculan film animasi 3 dimensi daripada film animasi 2 dimensi.

Wayang kulit merupakan salah satu bentuk animasi tertua di dunia. Bahkan ketika teknologi elektronik dan komputer belum diketemukan, pertunjukan wayang kulit telah memenuhi semua elemen animasi seperti layar, gambar bergerak, dialog dan ilustrasi musik.

Ada dua proses pembuatan film animasi, di antaranya adalah secara konvensional dan digital. Proses secara konvensional sangat membutuhkan dana yang cukup mahal, sedangkan proses pembuatan digital cukup ringan. Sedangkan untuk hal perbaikan, proses digital lebih cepat dibandingkan dengan proses konvensional. Tom Cardon seorang animator yang pernah menangani animasi Hercules mengakui komputer cukup berperan. "Perbaikan secara konvensional untuk 1 kali revisi memakan waktu 2 hari sedangkan secara digital hanya memakan waktu berkisar antara 30-45 menit."^[1] Dalam pengisian suara sebuah film dapat dilakukan sebelum atau sesudah filmnya selesai. Kebanyakan dubbing dilakukan saat film masih dalam proses, tetapi kadang-kadang seperti dalam animasi Jepang, sulih suara justru dilakukan setelah filmnya selesai dibuat.

Animasi 2Dimensi

1. Teknik konvensional

Teknik Celluloid (kadang-kadang disebut cell saja) ini merupakan teknik mendasar dalam pembuatan film animasi klasik. Setelah gambar mejadi sebuah rangkaian gerakan maka gambar tersebut akan ditransfer ke atas lembaran transparan (plastik) yang tembus pandang/ sel (cell) dan diwarnai oleh Ink and Paint Department. Setelah selesai film tersebut akan direkam dengan kamera khusus, yaitu multiplane camera di dalam ruangan yang serba hitam.

Objek utama yang mengeksploitasi gerak dibuat terpisah dengan latar belakang dan depan yang statis. Dengan demikian, latar belakang (background) dan latar depan (foreground) dibuat hanya sekali saja. Cara ini dapat menyiasati pembuatan gambar yang terlalu banyak.

· Pra-produksi:

o Konsep,

o Skenario,

o Pembentukan karakter,

o Storyboard,

o Dubbing awal,

o Musik dan sound FX

· Produksi:

o Lay out (Tata letak),

o Key motion (Gerakan kunci/ inti),

o In Between (Gambar yang menghubungkan antara gambar inti ke gambar inti yang lain)

o Clean Up (Membersihkan gambar dengan menjiplak)

o Background (Gambar latar belakang),

o Celluloid (Ditransfer ke atas plastik transparan)

o Coloring (Mewarnai dengan tinta dan cat).

· Post-produksi:

o Composite,

o Camera Shooting (Gambar akan diambil dengan kamera, dengan mengambil frame demi frame),

o Editing,

o Rendering,

o Pemindahan film ke dalam roll film.

2. Teknik digital

Setelah perkembangan teknologi komputer di era 1980, proses pembuatan animasi 2 dimensi menjadi lebih mudah. Yang sangat nyata dirasakan adalah kemudahan dalam proses pembuatan animasi. Untuk penggarapan animasi sederhana, mulai dari perancangan model hingga pengisian suara/dubbing dapat dilakukan dengan mempergunakan satu personal komputer. Setiap kesalahan dapat dikoreksi dengan cepat dan dapat dengan cepat pula diadakan perubahan. Sementara dengan teknik konvensional, setiap detail kesalahan kadang-kadang harus diulang kembali dari awal. Proses pembuatan animasi 2Dimensi digital terdiri dari:

· Pra-produksi:

o Konsep,

o Skenario,

o Pembentukan karakter,

o Storyboard,

o Dubbing awal,

o Musik dan sound FX

· Produksi:

o Layout,

o Key motion,

o In Between,

o Background,

o Scanning

o Coloring.

· Post-produksi:

o Composite,

o Editing,

o Rendering,

o Pemindahan film kedalam berbagai media berupa VCD, DVD, VHS dan lainnya.

Bab 9 & 10

(kebutuhan pengguna ke dalam model desain grafik pada aplikasi berbasis perangkat bergerak)

Desain grafis memiliki berbagai macam software, berikut adalah software desain grafis yang harus anda ketahui:

v Adobe Indesign

v Adobe Page Maker

v Adobe Frame Maker

v Macromedia Freehand

v Adobe Photoshop

v Photo Shine

v Photo Scape

v Picture Manager

Meskipun manager namun kemampuan yang dimiliki tidak hanya untuk mengolah gambar. Secara khusus fitu ini memiliki nama lengkap Microsoft Office Picture Manager merupakan software desain grafis yang memiliki instalasi Microsoft Office didalamnya. Fitur yang ada di dalamnya juga beraneka ragam seperti brightness dan contrast, re-color, menghilangkan efek red-eye pada Photo, hingga resize compressing mengubah ukuran Photo.

v ACDSee

Picture Manager adalah aplikasi software desain grafis yang memiliki kesamaan dengan Microsoft Office Picture Manager. Namun software ini memiliki berbagai macam tambahan fitur yang digunakan untuk kebutuhan professional desiner seperti fitur manejemen Photo Manager.

Berbagai macam software desain grafis dan Fungsinya bisa anda pelajari seperti yang sudah disebutkan diatas. Selain mempelajari anda juga disarankan untuk melakukan praktek secara langsung pada sesuai dengan imajinasi yang anda miliki. Jelek ataupun bagus karya yang anda hasilkan itu adalah karya anda sendiri.

Tahap analisa dan pengembangan metode Tahapanstudidananalisameliputistruktur pembelajaran studio perancangan logo dan sistem grafis disusun melalui tahapantahapan proses desain sebagai berikut:

1. Project overview :

Tujuan utama dari tahap ini agar mahasiswa mampu memahami prinsip-prinsip perancangan logo dan visual identity system serta contoh implementasinya dalam berbagai media desain komunikasi visual.

2. Problem identification, research of information &analysis :

Tujuan utama dari tahap ini agar mahasiswa dapat mengidentifikasi dan menyajikan data yang relevan dengan topik bahasan. Kemudian melakukan proses analisa-sintesa dan simpulan yang selanjutnya dapat dijadikan entry point pemecahan masalah desain.

3. Design concept :

Tujuan utama dari tahap ini agar mahasiswa mampu merumuskan konsep dan strategi untuk menjawab kebutuhan desain visual identity system yang dibutuhkan customer. Desain konsep yang diminta antara lain; konsep perencanaan, strategi, kriteria desain dan rencana aplikasinya.

4. Exploration/development and refinement:

Tujuan utama dari tahap ini agar mahasiswa mampu membuat, mengembangkan dan menyempurnakan gagasan desain visual identity dan graphic system sesuai dengan prinsip-prinsip desain. Kemudian membuat aplikasi desainnyadalam berbagai media secara terintegrasi sesuai dengan corporate program yang ditetapkan.

5. Production/evaluation:

Tujuan utama dari tahap ini agar mahasiswa mampu membuat desain logo dan visual identity system dalam bentuk prototype, mock-up atau model 3 dimensi lengkap sesuai format presentasi yang ditetapkan.

Bab 12

(konsep pemodelan desain grafik pada aplikasi berbasis web berikut elemen- elemen yang dibutukan)

beberapa jenis layout yang digunakan pada desain halaman website adalah:

· Static

Halaman layout static (statis) sering disebut sebagai “layout fixed” karena menggunakan ukuran halaman yang sudah ditetapkan dan tidak merubah ukuran lebar browser.

Halaman website tradisional umumnya dibuat dengan model atau jenis ini hingga berkembangnya responsive web design (RWD) pada tahun 2010

· Liquid

Layout liquid dibentuk dengan lebih relatif daripada layout static. Jenis ini akan membuat tampilan website terlihat sama dan baik walaupun dibuka pada browser yang berbeda.

Lebar presentase layout bisa menyesuaikan layar browser pengguna atau pengunjung website.

· Adaptive

Layout adaptive (adaptif) dibuat pada media CSS untuk mengenali lebar browser kemudian memodifikasi layout sesuai dengan lebarnya. Jenis ini menggunakan unit fixed (tetap) sama seperti layout static. Namun perbedaannya adalah ada beberapa lebar layout yang ditandai dengan beberapa hal teknis tertentu.

· Responsive

Layout responsive (responsif) menggabungkan konsep layout liquid dan adaptive. Halaman website dengan layout responsive umumnya disebut dengan layout yang mobile friendly dimana layout dan desain akan menyesuaikan browser dan gadget (mobile) yang digunakan.

Bentuk dan lebar layout seketika akan berubah dan menyesuaikan secara otomatif ketika website diakses dari gadget apa saja.

· Hybrid

Jenis layout ini merupakan yang terpopuler di antara layout lainnya. Layout hybrid merupakan campuran dari berbagai jenis layout berikut dengan konsep masing-masing.

Hal ini berarti, kemampuannya yang felksibel untuk menyesuaikan viewport browser hanya sementara karena mempertahankan website yang membutuhkan strukstur fixed (tetap).

Layout hybrid dianggap sebagai cara yang paling efektif untuk merancang dan mengembangkan layout.

· Cara & Konsep Yang Harus Diterapkan Untuk Tipografi Yang Bagus

Setelah mengenal jenis-jenis font, sekarang mari kita pelajari bagaimana membuat tipografi yang baik pada website anda. Poin-poin dibawah ini adalah konsep dan teknik yang harus anda patuhi untuk membuat tipografi yang baik.

1. Komposisi Font

Pemakaian font pada sebuah website tidak boleh seenak jidat. Mentang-mentang lihat website-website lain menggunakan font yang unik, tidak serta merta anda bisa menambahkannya pada website anda. Penggunaan font dalam website tidak boleh terdiri lebih dari 3 jenis font. Bahkan 3 juga terbilang kebanyakan.

Komposisi font yang baik adalah menggunakan 2 jenis font, yaitu 1 font untuk judul atau tulisan-tulisan besar di website, dan 1 font lain untuk konten. Kedua font tersebut juga sebaiknya tidak 1 jenis, misal keduanya adalah font jenis serif. Jadi, sebaiknya 1 jenis font serif, dan 1 jenis font sans-serif.

Gunakan font serif untuk judul, dan gunakan sans-serif untuk konten. Kombinasi ini sudah menjadi hal umum yang bisa anda lihat di kebanyakan website-website besar di dunia.

2. Styling Teks Dan Paragraf

A. Leading

Leading adalah istilah yang biasa digunakan untuk jarak baris tiap baris sebuah paragraf. Leading, sangat berpengaruh pada kenyamanan baca sebuah teks. Jarak yang dibuat oleh leading ini membuat mata lebih rileks dan mudah dalam membaca teks.

Tinggi leading yang baik biasanya berkisar 2-5pt lebih besar daripada tinggi font. Dalam web design, leading dapat ditentukan dengan properti css line-height. Nilainya bisa berupa px ataupun angka desimal.

B. Ritme Vertikal

Ritme vertikal sebenarnya mirip dengan leading, namun tidak terbatas pada paragraf. Ritme vertikal mengacu pada ketetapan atau konsistensi jarak vertikal antara teks 1 dengan teks lainnya. Penerapannya, bisa dilakukan dengan menyamakan leading untuk setiap paragraf, jarak antara paragraf satu dengan yang lainnya, serta jarak judul dengan isi. Semuanya harus konsisten.

C. Warna

Secara default, warna teks yang ditampilkan di web adalah warna hitam pekat (#000). Sebenarnya ini kurang baik. Hitam pekat akan terlalu kontras dengan warna-warna yang ada di web, apalagi jika webnya mengusung desain flat. Warna yang bagus untuk teks pada desain web era modern adalah hitam keabu-abuan, dari interval #333 – #999.

Namun, kita juga bisa menyesuaikan dengan desain dan dominasi warna yang ada pada website kita, seperti yang saya lakukan pada website ini. Dalam penggunaan warna pada font, hindari warna yang terlalu kontras. Gunakanlah warna yang lebih lembut dan cocok dengan desain web secara keseluruhan.

Menggunakan warna gelap yang dominan di pakai dalam website juga bisa menjadi pilihan anda.

D. Ketebalan Teks

Ketebalan teks juga mempengaruhi tipografi. Dalam web design, anda bisa menentukannya dengan styling css melalui properti font-weight. Nilainya berkisar dari interval 100 – 900, bold dan bolder. Untuk teks pada konten, biasanya sudah cocok dengan nilai standar.

Namun, pada teks heading terkadang nilai standarnya (bold), justru membuat tidak cocok.

E. Panjang Teks Perbaris

Hal lain yang perlu anda perhatikan pada styling paragraf adalah jumlah karakter rata-rata pada tiap baris. Perlu diingat bahwa orang tidak nyaman dengan baris yang terlalu panjang, atau terlalu pendek. Oleh karena itu idealnya, setiap baris terdiri dari 40 – 80 karakter, termasuk spasi.

Setiap situs memiliki lebar container untuk konten yang berbeda-beda. Jadi sebaiknya sesuaikan ukuran font dengan container agar setiap baris terdiri dari jumlah karakter yang ideal.

3. Padding Dan Margin

Siapa bilang tipografi dalam web itu cuma teks saja?. Padding dan margin juga sangat berperan dalam tipografi pada web. Dalam hal ini, untuk membuat white space yang ideal.

Gunakanlah padding dan margin yang pas untuk setiap elemen yang berisi teks pada website anda. Padding yang ideal untuk container biasanya berkisar antara 10 – 30 piksel. Begitu juga untuk jarak atau margin elemen satu dengan yang lainnya. Besarnya, berbanding lurus dengan besar font yang digunakan.

Selain itu, penggunaan padding dan margin juga harus konsisten. Artinya, jika elemen a di beri padding atau margin sebesar 20px, maka elemen yang sejenisnya pun harus sama. Ini juga berlaku pada jarak antar paragraf.

4. Penekanan Pada Teks

Penekanan pada teks tertentu adalah hal yang lumrah untuk sebuah bacaan. Biasanya, untuk menekankan sebuah teks digunakan bold, Italic dan underline. Lalu, mana yang paling baik ?

Relatif. Itu tergantung pada jenis teks yang ditekankan. Bold, memiliki kesan yang lebih mendalam. Disusul oleh underline, kemudian italic.

Namun, teks apapun yang anda tekankan jangan pernah menggunakan 2 style sekaligus. Jangan menekankan sebuah teks dengan menggunakan bold sekaligus italic.

5. Hirarki Dan Ukuran Font

Last but not least, hirarki dan ukuran font pada website anda juga harus anda tentukan. Secara default, browser yang menentukan ukuran setiap tag heading (<h1>,<h2>,<h3>,<h4>,<h5>,<h6>), tag paragraf (<p>), tag small (<small>), dan sebagainya. Namun, itu tentu saja tidak selalu cocok dengan desain web anda.

Oleh karena itu, tentukan ukuran font secara terstruktur. Hal ini akan membuat pengguna bisa membedakan mana judul utama, sub judul, konten dan sebagainya.

· Format Gambar untuk Website/Blog

Format image ada beberapa jenis, yang umum untuk ditemukan adalah JPEG (JPG), GIF dan PNG juga BMP. Perbedaannya tidak dapat dilepaskan dari jenis kompresi yang digunakan untuk menyimpan data.

Semakin besar kompresi semakin sedikit data yang disimpan. Dan jika ukuran data semakin besar, akan menambah waktu yang diperlukan untuk menampilkannya pada web browser. Ini lah pertimbangan utama dalam memilih jenis format gambar yang ingin kamu tampilkan di dalam sebuah blog.

Berikut acuan sederhananya:

· PNG sangat baik untuk dipergunakan pada kebanyakan web browser (IE6+ butuh sedikit sentuhan CSS untuk pengaturan transparansi). Format jenis ini sangat tepat untuk menyimpan grafik (ilustration) atau foto (kualitas tinggi)

· JPG adalah pilihan terbaik untuk menampilkan foto secara online, walau kualitasnya tidak sebagus PNG tetapi cukup bisa diterima mata manusia

· GIF sangat baik untuk menampilkan gambar grafik (jika kamu tidak mau menggunakan PNG), tapi jangan ubah foto kamu menjadi format GIF karena hasilnya tidak sedap dipandang mata

· BMP bisa dikategorikan sebagai gambar tidak terkompresi, tidak disarankan untuk penggunaan pada blog (menghabiskan bandwidth saja)

· Menerapkan Warna Efektif ke dalam Website

Ada beberapa hal yang harus diperhatikan dalam menerapkan warna. Berikut apa saja yang sebaiknya dilakukan dalam mengkombinasikan warna ke dalam desain website.

1. Gunakan warna brand Anda

Warna identitas brand Anda merupakan hal yang penting untuk selalu diterapkan ke berbagai media, termasuk media online seperti website sebagai bentuk branding perusahaan. Begitu juga website Coca Cola yang menerapkan identitas brand-nya yaitu merah. Jangan menggunakan warna yang jauh berbeda dengan warna brand Anda, karena hal itu akan membuat kesan tidak profesional dan tidak konsisten. Gunakan warna brand sebagai warna utama dalam branding usaha Anda.

2. Terapkan psikologi warna

Secara tidak sadar, warna mampu memberikan pengaruh kedalam pikiran seseorang. Saat kita mengunjungi halaman website, mata akan tertarik untuk memperhatikan sesuatu yang terlihat berbeda dan menonjol. setelah memahami beberapa penjelasan tentang teori warna sebelumnya, Anda dapat menerapkannya ke dalam desain website Anda. Seperti sifat warna-warna panas yang cerah, cukup efektif untuk menarik perhatian, jika digunakan sebagai informasi penting, tombol, link, headline, dll. Begitu juga dengan warna-warna dingin yang menenangkan dapat digunakan sebagai background, text maupun paragraf, dll.

3. Sesuaikan warna dengan target pasar

comparison

Setiap konsumen memiliki ketertarikan warna yang berbeda sesuai umur maupun jenis kelaminnya. Begitu juga setiap bidang usaha akan selalu berbeda dalam menerapkan warna berkaitan dengan profesionalitas usaha.

Sebagai contoh warna ceria yang tampil fun dan menyenangkan, akan lebih efektif di gunakan untuk target konsumen bayi/anak-anak maupun wanita, serta digunakan dalam bidang usaha yang lebih santai. Sangat tidak efektif, jika warna ceria tersebut digunakan untuk target konsumen serta bidang usaha yang lebih serius dan profesional, seperti usaha kontraktor, politik, akuntan, hukum, dll.

4. Pastikan warna teks kontras dengan background

Kontras teks dalam desain website jugalah penting. Teks menjadi sumber rujukan bagi pengunjung untuk mengetahui informasi mengenai bisnis Anda. Untuk itu, membuat teks mudah dibaca dan untuk menghindari ketegangan mata pengunjung website, harus ada kontras yang tinggi antara warna teks dan warna background Anda.

Gunakan teks warna gelap untuk background terang. Sebaliknya, gunakan warna terang untuk teks dengan background gelap. Jangan menyulitkan pengunjung dalam membaca isi konten website Anda, dengan menggunakan kontras warna yang rendah antara teks dan background.

· KONSEP RESOLUSI PADA MONITOR

a. Resolusi Layar

Resolusi Layar adalah jumlah pixel pada setiap dimensi layar monitor. Istilah dapat menjadi ambigu terutama karena resolusi yang ditampilkan dipengaruhi oleh faktor-faktor yang berbeda. Contohnya, Cathode Ray Tube (CRT), monitor layar datar (termasuk LCD) tampilan proyeksi menggunakan gambar elemen susunan tetap (pixel / piksel).

Hal ini biasanya dinyatakan dalam Lebar x Tinggi, dengan satuan pixel: misalnya, “1024 x 768” yang berarti lebarnya 1024 pixel dan tingginya 768 pixel.

Penggunaan istilah “Resolusi Layar” berlaku untuk susunan yang menampilkan pixel tetap seperti Plasma Display Panel (PDP), Liquid Crystal Display (LCD), Digital Light Processing (DLP).

Istilah “Resolusi Layar” umumnya digunakan untuk menyebut dimensi pixel, jumlah pixel dalam masing-masing dimensi (misal, 1920 x 1080), yang tidak mencerminkan kerapatan pixel, yaitu jumlah piksel per satuan jarak atau luas area. Dalam pengukuran digital, kerapatan layar memiliki satuan pixel per inci.

Dalam pengukuran analog jika tinggi layar 10 inci, maka resolusi horizontal diukur melintasi persegi 10 inci, yang dinyatakan sebagai “resolusi garis horisontal, per tinggi gambar.

Grafik di atas menunjukkan sebagian display resolusi umum, dengan warna dari setiap jenis resolusi layar yang menunjukkan rasio.

b. Jumlah Piksel untuk Berbagai Resolusi

Metrik lain memperlihatkan perspektif yang sangat jelas adalah jumlah piksel. Sebuah tampilan Quad HD memiliki 3.69 juta piksel, lebih banyak 78% dibandingkan 1080p yang hanya 2,07 juta piksel, dan empat kali lipat dibanding tampilan 720p.

Untuk mengukur jumlah piksel dalam sebuah resolusi layar, misal: 1920 x 1080 berarti bahwa layar memiliki lebar terdiri dari 1920 piksel dan tinggi terdiri dari 1080 piksel, dengan total 1920 x 1080 = 2.073.600 piksel. Resolusi yang paling populer adalah:

1280 x 720 (HD, 720p)

1920 x 1080 (FHD, Full HD, 2K, 1080p)

2560 x 1440 (QHD, WQHD, Quad HD, 1440p)

3840 x 2160 (UHD, Ultra HD, 4K, 2160p)

7680 x 4320 (FUHD, Full Ultra HD, 8K, 4320p)

Bagaimana hal ini terlihat dalam kehidupan nyata? Di atas kertas memang tampak jelas perbandingannya, tapi perbedaannya itu hanya tampak jika dilihat dari dekat, jika dibandingkan dari jarak normal sekitar 10 inci saja mungkin tidak akan terlihat perbedaannya.

c. Aspek Rasio

Melihat persepsi mengenai “Resolusi Layar” dapat dipengaruhi oleh sejumlah faktor seperti Resolusi Gambar dan Resolusi Optik. Salah satu faktor adalah bentuk persegi panjang layar, yang dinyatakan sebagai rasio dari lebar berbanding tinggi fisik. Hal ini dikenal sebagai Aspek Rasio.

Sebuah aspek rasio fisik layar dan rasio aspek pixel individu belum tentu sama. Sebuah susunan 1280 x 720 pada layar 16:9 memiliki piksel berbentuk persegi. Sedangkan susunan 1024 x 768 pada layar 16:9 memiliki piksel berbentuk persegi panjang.

Contoh bentuk pixel yang mempengaruhi “Resolusi” sangat jelas: layar dapat menampilkan lebih banyak informasi dalam area yang lebih kecil dengan resolusi yang lebih tinggi membuat gambar terlihat lebih jelas atau “tajam”. Namun, layar LCD yang lebih baru tersebut tetap pada resolusi tertentu; membuat resolusi lebih rendah pada jenis layar akan sangat menurunkan ketajaman, sebagai proses penyisipan digunakan untuk “memperbaiki” resolusi masukan non asli ke dalam display keluaran resolusi asli.

· Desain yang Sesuai Dengan User Experience dan User Interface

User Experience

Proses meningkatkan kepuasan pengguna (pengguna aplikasi, pengunjung website) dalam meningkatkan kegunaan dan kesenangan yang diberikan dalam interaksi antara pengguna dan produk.

Bahasa gampangnya, UX Design itu proses membuat sebuah website atau aplikasi yang kamu buat menjadi mudah untuk digunakan dan tidak membingungkan ketika digunakan oleh pengguna.

User Interface

Desain antarmuka untuk mesin dan perangkat lunak, seperti komputer, peralatan rumah tangga, perangkat mobile, dan perangkat elektronik lainnya, dengan fokus pada memaksimalkan pengalaman pengguna.

Bahasa gampangnya yaitu UI Design adalah bagaimana suatu website atau aplikasi yang kamu buat terlihat seperti apa. Orang biasa menyebutnya sebagai tampilan atau desain sebuah website.

Perbedaan UX dan UI

UX berkonsentrasi pada bagaimana sebuah produk terasa dan apakah itu memecahkan masalah bagi pengguna. Sedangkan User Interface adalah bagaimana suatu website atau aplikasi yang kamu buat terlihat dan berbentuk seperti apa. Hal tersebut mencakup Layout (tata letak), Visual Design (desain visual) dan Branding.

· RAGAM WEB BROWSER

Browser adalah Sebuat program atau software yang digunakan untuk menjelajah dunia maya internet dalam konteks komputer. Browser diambil dari kata browse (bahasa inggris) yang berarti Membaca atau Melihat – lihat. Browser juga dibagi lagi menjadi sebagai berikut:

1. Microsoft Internet Explorer

2. Mozilla Firefox

3. Google Chrome

4. Opera

5. Safari

6. Netscape Communications

7. Flock

8. Wyzo

9. iCab

· PERANGKAT LUNAK DESAIN GRAFIS

Desain grafis adalah cabang ilmu yang berasal dari seni desain yang menggunakan bantuan komputer untuk melakukan kegiatan. Orang yang bekerja dalam bidang ini disebut desainer. Desain grafis memiliki berbagai macam software, berikut adalah software desain grafis yang harus anda ketahui:

v Adobe Indesign

v Adobe Page Maker

v Adobe Frame Maker

v Macromedia Freehand

v Adobe Photoshop

v Photo Shine

v Photo Scape

v Picture Manager

v ACDSee

Bab 13

(kebutuhan pengguna terhadap grafik pada aplikasi berbasis web)

Penggunaan warna yang tepat

Warna sangat berpengaruh dalam sebuah desain. Seperti yang telah kita ketahui, masing masing warna memiliki karakter tersendiri, dan mecerminkan suasana tertentu. Skema warna (kombinasi warna) dalam desain harus bisa mewakili karakter yang diinginkan. Tetapi perlu diingat, kombinasi warna yang berlebihan akan mengalihkan pengunjung dari konten website.

Teks yang mudah dibaca

Teks harus mudah dibaca, hal ini bisa dicapai dengan mengatur kontras warna teks dengan background. Selain itu penggunaan font yang tepat juga perlu diperhatikan, jenis font, ukuran font, style dan konsistensinya dalam desain. Selain itu pengaturan paragraf dan jarak antara teks dengan elemen lain juga perlu diperhatikan. Whitespace atau ruang kosong antar elemen harus harmonis. Semua hal tersebut bertujuan supaya Teks mudah dibaca.

Desain visual yang harmonis

Image atau gambar secara visual merupakan unsur atau elemen utama dalam desain. Image bisa digunakan sebai pemanis, atau penyeimbang atau point of interest. Sebaiknya pemilihan image sesuai dengan keseluruhan tema dan karakter desain website. Komposisi image dengan elemen lain juga harus sesuai, adakalanya sebuah website membutuhkan image yang besar (hampir fullscreen) untuk memberi kesan tertentu, dan dikombinasi dengan teks yang lebih kecil porsinya, ada pula website dengan komposisi teks yang lebih banyak dan image hanya sebagai unsur tambahan. Komposisi antara image dengan teks tergantung dari tema dan karakter yang ingin dibangun.

Yang penting harus bijaksana dalam memilih, menempatkan, dan mengkomposisi image, dan yang tidak kalah penting adalah kualitas image itu sendiri. Hal lain yang harus menjadi pertimbangan adalah besarnya file. Kecepatan load sebuah halaman website sebagian besar ditentukan oleh besarnya ukuran file, terutama image, apalagi bagi kita di Indonesia yang kecepatan akses internetnya sebagian besar dibawah rata-rata.

Layout yang Simpel

Layout atau tataletak desain diusahakan sesederhana mungkin, minimalisir elemen-elemen yang tidak penting, maksimalkan whitespace (jarak antar elemen). Website dengan layout yang baik, mudah untuk dijelajahi, pengunjung mudah untuk menemukan sesuatu, dan dengan cepat menemukan apa yang dicarinya.

Layout yang berantakan membuat pengunjung kesulitan dan membutuhkan waktu lebih lama untuk menemukan sesuatu. Penempatan yang tidak sesuai, point of interest yang menyesatkan, dan urutan tata letak yang acak, sangat tidak menguntungkan.

Alur yang mudah dimengerti

Layout desain website harus bisa menuntun pengunjung dan mengarahkan mereka ke sesuatu yang kita inginkan, jadi kitalah yang menuntun alur perhatian pengunjung dari titik a, ke titik b, ke titik C, dan seterusnya, sehingga tujuan kita dan misi dari website bisa dicerna dengan baik oleh pengunjung. Hal ini tidaklah mudah, berbeda dengan media lain seperti televisi, dan koran, audience dalam kendali pemberi informasi, mereka menerima apa adanya dan pasif, dan tidak melakukan tindakan aktif untuk memilah. Sedangkan pada website, pengunjung memiliki kendali penuh, mereka aktif, dan oleh karena itu alur dari desain website harus jelas dan mudah dipahami agar pengunjung tidak frustasi menemukan apa yang mereka inginkan.

Menu Navigasi yang jelas

Salah satu elemen penting yang juga wajib diperhatikan adalah navigasi atau menu. Menu navigasi adalah satu-satunya cara pengunjung berinteraksi dengan website. Ada banyak cara dan banyak desain menu navigasi, tetapi yang tidak boleh dilupakan adalah fungsi utamanya, sebagai alat interaksi pengunjung dengan website.

Website bisa saja mempunyai beberapa menu/navigasi, bisa diatas pada header, atau pada sidebar, maupun dibawah pada footer. Tidak ada rumus yang mengharuskan dimana kita menempatkan menu, yang penting harus menyatu dengan alur dan layout desain sebuah website.

Bab 14 & 15

(Perangkat lunak disain grafis yang diperlukan dalam memperindah tampilan web, serta proses desain grafis)

· Software Untuk Membuat Website

Era digital ini membiasakan kita untuk selalu terhubung dengan yang namanya internet. Internet inilah yang menjadi pintu pertama kita menjelajahi dunia maya, banyak yang bisa kita jelajahi di dunia maya salah satunya adalah berselancar di website. Website itu sendiri identik dengan halaman di internet yang menampilkan informasi yang memang betul-betul dibutuhkan oleh para pengunjung atau bisa juga disebut para pembaca. Jadi, apabila diibaratkan, website itu bisa berupa sebuah wadah yang menyajikan beragam ilmu-ilmu yang hanyalah tinggal kita ambil (akses) dan mulai kita baca.

Banyaknya website yang beredar ini menjadi pekuang bagi para web designer, tapi tahukan Anda bahwa sesungguhnya Anda juga bisa membuat website sendiri dengan menggunakan software pendukung. Dibawah ini sudah kami rangkum beberapa software untuk membuat website yang bisa Anda gunakan untuk membuat sebuah website.

1. Web Builder Visual (Wysiwyg editor)

Software yang satu ini bisa dimanfaatkan untuk menyunting website secara visual. Aplikasi dengan basis Wysiwyg editor ini Anda dapat merancang website dengan praktis dan mudah. Sehingga tidak memerlukan pengetahuan mendasar tentang pemrograman sebuah website.

Dengan memanfaatkan Web Builder Visual ini, Anda bisa menciptakan sebuah website yang sangat profesional dengan mudah hanya dalam beberapa wakt saja. Jadi, bagi pemula yang belum mengetahui banyak tentang pemrograman website bisa mencoba memanfaatkan Web Builder Visual ini.

2. Dreamweaver

Software untuk pembuatan website lainnya adalah dreamweaver. Software ini bisa Anda manfaatkan untuk pembuatan website, baik website yang sederhana hingga website profesional. Untuk memanfaatkan software ini kita bisa mencoba salah satu dari jenis dreamweaver, yakni macromedia dan adobe.

3. Notepad

Bagi pemula memang sangat cocok untuk memanfaatkan aplikasi notepad ini untuk merancang dan membuat sebuah website. Notepad sendiri adalah aplikasi editor teks yang biasanya digunakan untuk CSS, PHP, HTML dan lain sebagainya. Selain itu, memanfaatkan aplikasi pembuat website ini tergolong lebih ringan dibandingkan aplikasi lainnya.

4. CoffeeCup HTML Editor

Aplikasi pembuat website secara gratis lainnya adalah CoffeeCup HTML Editor. Namun untuk versi gratisnya sendiri tidak memiliki beberapa fitur, seperti Image Mapper, Visual Editor, Website Color Schemer dan CSS Menu Designer. Akan tetapi, Anda dapat membuat tampilan sebuah blog yang menarik dengan memanfaatkan aplikasi CoffeeCup HTML Editor ini.

5. WordPress

Software lainnya yang bisa Anda manfaatkan untuk membuat sebuah website adalah WordPress. Seperti kita ketahui, wordpress memiliki 2 jenis yaitu wordpress instan dan wordpress install / CMS. WordPress instan bisa kita manfaatkan untuk membuat blog langsung dari situs wordpressnya itu sendiri dengan cara mendaftarkan akun Anda di sana. Sedangkan wordpress install sendiri bisa dimanfaatkan untuk membuat sebuah website dengan cara mengunduh aplikasinya terlebih dahulu lalu menginstalnya dan mulai merancang website.

6. PageBreeze

Software ini adalah software editor HTML yang menekankan kesederhanaan dalam pembuatannya. Kesederhanaan disini berarti aplikasi ini lumayan agak mudah untuk dijalannkan. Software ini gratis dengan ukuran file 8 Mb. Keunggulan software membuat website ini adalah support untuk jenis HTML baru. Terdapat pemilahan antara berbagai tag dalam kode html. Terhubung otomatis dengan ratusan template gratis yang dapat digunakan. Untuk menggunakannya hanya dengan sistem operasi windows 32 maupun 64-bit.

· PROSES DESAIN GRAFIS

1.Project overview :

Tujuan utama dari tahap ini agar mahasiswa mampu memahami prinsip-prinsip perancangan logo dan visual identity system serta contoh implementasinya dalam berbagai media desain komunikasi visual.

2. Problem identification, research of information &analysis :

3.Design concept :

4.Exploration/development and refinement:

5. Production/evaluation:

Tujuan utama dari tahap ini agar mahasiswa mampu membuat desain logo dan visual identity system dalam bentuk prototype, mock-up atau model 3 dimensi lengkap sesuai format presentasi yang ditetapkan.

Sumber :

http://deasyamalina052.blogspot.com/2016/01/huruf-tipografi-format-dan-tata-letak.html

https://id.wikipedia.org/wiki/Desain_grafis

file:///C:/Users/E/Downloads/3590-9096-1-SM.pdf

https://munifahajrina.blogspot.com/2018/08/tata-letak-layout-dalam-desain-grafis.html

https://design.tutsplus.com/id/articles/different-image-file-types-and-formats--cms-32014

https://fastwork.id/blog/software-desain-grafis/

https://flashcomindonesia.com

https://crocodic.com

www.definisimenurutparaahli.com

https://ruanglaptop.com