Program Aplikasi II / Design Grafis Dosen : Dimas

Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Program Aplikasi II / Design Grafis
Dosen : Dimas Prasetyo Tegar Asmoro,S.Kom.
Desain grafis adalah suatu bentuk komunikasi visual yang menggunakan gambar untuk
menyampaikan informasi atau pesan seefektif mungkin. Dalam disain grafis, teks juga
dianggap gambar karena merupakan hasil abstraksi simbol-simbol yang bisa dibunyikan.
disain grafis diterapkan dalam disain komunikasi dan fine art. Seperti jenis disain lainnya,
disain grafis dapat merujuk kepada proses pembuatan, metoda merancang, produk yang
dihasilkan (rancangan), atau pun disiplin ilmu yang digunakan (disain).(wiki-id)
Grafik secara umum berarti gambar dan dapat diartikan sebagai diagram (Bhs. Inggris:chart).
Diagram memiliki fungsi untuk memvisualisasikan data berupa angka kedalam bentuk
gambar sehingga mudah di pahami. Dalam dunia grafis banyak sekali istilah-istilah grafis
yang perlu dipahami oleh seorang calon desain grafis. Istilah ini berguna sebagai ala
mempermudah komunikasi bagi para seorang desain grafis baik desain grafis yang
menggunakan komputer maupun secara manual (handmade).
Komputer di dalam merepresentasikan gambar memiliki dua cara yaitu
dengan bitmap danvektor grafik. Berikut ini beberapa istilah yang berkaitan dengan desain
grafis :
Gambar Vektor
Vector merupakan gambar digital yang berbasiskan persamaan perhitungan matematis.
Gambar vektor umumnya berukuran lebih kecil bila dibandingkan dengan gambar bitmap.
Beberapa format gambar vektor di antaranya: .CDR, .AI, .SVG, .EPS, dan dll . Gambar
Vektor menggabungkan titik dan garis untuk menjadi sebuah objek, sehingga gambar tidak
menjadi pecah biarpun diperbesar atau diperkecil, tidak seperti gambar Bitmap.
Gambar bertipe vektor terbentuk dari garis dan kurva hasil dari perhitungan matematis dari
beberapa titik, sehingga membentuk suatu objek gambar. Vektor menampilkan sebuah
gambar berdasarkan perhitungan koordinat geometris gambar tersebut. Tampilan gambar
vektor, walaupun bersifat relatif lebih kaku daripada tampilan bitmap, kualitasnya tidak
bergantung kepada resolusi gambar.
STMIK Jayakarta
1
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Gambar tipe ini bisa diubah-ubah ke berbagai ukuran dan juga dapat dicetak pada tingkat
resolusi sebesar apapun tanpa kehilangan detil dan ketajaman gambar. Tampilan vektor
merupakan pilihan terbaik ketika harus menampilkan gambar-gambar yang harus bisa
mempertahankan ketajaman garis ketika ukuranya diubah. Ketika bekerja dengan gambar
Vektor, kita akan mengedit objek berdasarkan perhitungan matematis-nya.
Karena monitor menampilkan gambar dengan cara menggunakan jaringan titik, maka kedua
macam tipe gambar (bitmap dan Vektor) akan diperlihatkan sebagai pixel pada layar monitor.
Begitu juga ketika kita hendak menampilkan gambar Vektor ke suatu halaman web, dimana
kita harus melakukan export gambar Vektor tersebut ke format yang di dukung oleh browser
(JPG, GIF, PNG, dll). Sifat gambar vektor yang telah di export tersebut otomatis berubah
menjadi tipe bitmap/raster, meskipun dibuat denganprogram/software penghasil gambar
Vektor.
Berbeda dengan bitmap, vektor grafik merepresentasikan gambarnya tidak dengan
menggunakan pixel, tetapi dengan kurva dan garis yang didefinisikan dalam persamaan
matematis yang disebut vektor. Misal untuk menggambar lingkaran maka didefinisikan
persamaan matematis dari lingkaran sehingga membentuk garis pembatas lingkaran. Didalam
garis pembatas tersebut diberi warna sehingga terbentuklah lingkaran. Kedua cara
perepresentasian gambar tersebut mempunyai kekurangan dan kelebihan masing masing.
Pada gambar bitmap sangat baik digunakan untuk merepresentasikan gambar yang sangat
kompleks dan detail. Tetapi kekurangannya adalah ukuran filenya tergantung dari ukuran
gambar dan resolusinya.
Format Bitmap
Bitmap yaitu representasi dari citra grafis yang terdiri dari susunan titik yang tersimpan di
memori komputer. Dikembangkan oleh Microsoft dan nilai setiap titik diawali oleh satu bit
data untuk gambar hitam putih, atau lebih bagi gambar berwarna. Kerapatan titik-titik
tersebut dinamakan resolusi, yang menunjukkan seberapa tajam gambar ini ditampilkan,
STMIK Jayakarta
2
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
ditunjukkan dengan jumlah baris dan kolom, contohnya 300px/inch (satuan ini sering dipakai
agar hasil cetak tidak pecah, lebih besar lebih bagus). Terkadang resolusi diartikan sebagai
lebar dan panjangnya suatu media, namun pada pembahasan format gambar Resolusi
diartikan sebagai banyaknya warna atau titik warna dalam satuan ukuran tertentu. Untuk
menampilkan citra bitmap pada monitor atau mencetaknya pada printer, komputer
menterjemahkan bitmap ini menjadi pixel (pada layar) atau titik tinta (pada printer). Beberapa
format file bitmap yang populer adalah BMP, PCX ,TIFF. JPEG, GIF, dll.
Gambar bitmap bisa disebut juga dengan gambar raster merupakan kumpulan kotak-kotak
kecil (pixel). Titik-titik pixel tersebut ditempatkan pada lokasi-lokasi tertentu dengan nilainilai warna tersendiri yang secara keseluruhan akan membentuk sebuah tampilan. Gambar
bertipe bitmap sesungguhnya adalah mozaik dari ribuan atau jutaan pixel.
Ketika bekerja dengan gambar bitmap kita akan mengedit pixel-pixel yang merupakan bagian
dari sebuah objek gambar.
Tampilan bitmap mampu menunjukkan kehalusan gradasi warna dan bayangan dari sebuah
gambar, karena itu tipe bitmap merupakan media elektronik yang paling tepat untuk gambargambar dengan perpaduan gradasi warna yang rumit, seperti foto dan lukisan digital. Gambar
bitmap sangat tergantung dengan resolusinya, karena setiap gambar mempunyai jumlah pixel
yang pasti. Hal ini berarti bahwa sebuah gambar akan sangat tergantung dari jumlah pixel
yang membentuknya. Apabila dilakukan pembesaran ukuran gambar dengan resolusi kecil,
maka gambar akan kehilangan detil dan akan terlihat kotak-kotak pixel yang berundak
(jagged).
Pixel-pixel yang membentuk gambar tersebut memiliki warna warna tertentu dan jumlah
warna yang boleh dimiliki oleh suatu gambar dinamakan intensitas. Biasanya dikenal istilah
256 warna, high color, 16 juta warna (true color) gradasi abu-abu (grayscale), serta hitamputih (black & white). Semakin banyak jumlah warna dalam suatu gambar maka gambar
yang dihasilkan akan semakin bagus. Jumlah warna maksimum dari gambar dapat dilihat dari
STMIK Jayakarta
3
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
jenis filenya. Misal file gambar yang berekstensi .jpg akan memiliki maksimum 16 juta
warna, atau file yang berekstensi .gif memiliki jumlah warna maksimum 256.
Jika file bitmap diperbesar maka ketajaman gambar akan berkurang. Sedangkan pada vektor
grafis ukuran gambar tidak mempegaruhi ukuran file. Jika gambar diperbesar maka
ketajamannya tetap sama dengan sebelumnya.Ukuran file dari gambar vektor grafis
dipengaruhi oleh kompleksitas dari persamaaan vektor yang digunakan. Misal ada dua
gambar yang besarnya sama. Gambar yang pertama adalah gambar lingkaran sedangkan
gambar yang kedua adalah gambar tali yang melingkar tidak beraturan. Ukuran file gambar
tali akan lebih besar daripada gambar lingkaran. Kekurangan dari vektor grafis tidak mampu
menampilkan gambar secara detail dan kompleks.
Perangkat lunak untuk Image editor yang menggunakan gambar jenis bitmap antara lain
adobe photoshop, corel photopaint, dan lain lain. Sedangkan yang menggunkan gambar
vektor grafik antara lain corel draw adobe ilustrator, macromedia flash. Dari kelebihan dan
kekurangan kedua jenis gambar tersebut maka sebelum mendesain suatu obyek perlu
dipertimbangkan terlebih dahulu tujuan dari pembuatan obyek tersebut.
Tabel Perbedaan vektor dan Bitmap
Vektor
Bitmap
Disusun oleh objek geometris yang dibuat
berdasarkan perhitungan matematis
Disusun oleh objek yang disebut pixel
Sifatnya resolution independent
Sifatnya
resolution
dipengaruhi resolusi
dependent
atau
STMIK Jayakarta
4
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pengaruh perbesaran tidak pecah, blur atau
rusak
Pengaruh perbesaran pecah, blur dan rusak
jika melewati batas toleransi tampilan
Ukuran penympanan relatif kecil
Ukuran penympanan relatif besar
Digunakan untuk ilustrasi dengan bentuk
geometris sederhana, warna solid atau
gradasi tanpa terlalu banyak variasi warna.
Cocok untuk logo dan jenis desain yang
mengandalkan kesederhanaan bentuk.
Digunakan untuk gambar kompleks, berupa
ragam warna dan bentuk yang beraneka,
seperti foto dari hasil bidikan kamera.
Format penyimpanan bisa berupa AI, CDR,
FH, EPS
Format penyimpanan PSD, TIF, JPEG,
GIF, BMP
Program yang digunakan adalahCorelDraw,
Adobe Illustrator, Macromedia Freehand
Software yang
digunakan
adalah
AdobePhotoshop, Corel Photopaint,
MS
Paint
Dengan membandingkan kedua format gambar di atas akan membantu Anda memahami
kinerja bitmap dan vektor.
Untuk praktikum kita akan menggunakan Adobe Photoshop (Bitmap) dan Corel Draw
(Vektor).
STMIK Jayakarta
5
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 1 : Clone Stamp Tools,Channel warna
Mengenal clone stamp
tool dan channel warna grayscale juga rgb dengan cara
mempraktekkan pengolahan gambar berikut :
Dari gambar diatas ctrl+A,ctrl+C dan ctrl+V agar kita bekerja di dokumen baru.
Setelah itu pilih clone stamp tool untuk menghilangkan cacat foto ( bercak putih ).
Setelah itu tekan alt, agar kursor menjadi
kemudian klik bagian yang ingin dicopy
untuk menutup bercak putih. Sekarang klik bercak putihnya, sehingga bercak putih tertutup
menjadi seolah menghilang cacat fotonya. Lakukan ke seluruh bercak putih dengan
mengulang menekan alt, hingga tertutup seluruh bercak putihnya.
STMIK Jayakarta
6
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Setelah itu, pilih menu image, mode, pilih RGB sehingga sekarang dokumen psd memiliki 3
channel warna.
STMIK Jayakarta
7
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Setelah itu menggunakan magnetic tool/selection tool :
STMIK Jayakarta
8
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
pilih bagian yang ingin diubah warna, lalu pilih image, adjustement color balance :
set sesuai dengan warna yang diinginkan :
STMIK Jayakarta
9
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Hasil Akhir :
STMIK Jayakarta
10
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 2 : Selection Tools / Lasso Tools,Clone Stamp tools
Mengenal selection tool, stamp tool untuk memindahkan topi pada gambar berikut :
Dari gambar diatas ctrl+A,ctrl+C dan ctrl+V agar kita bekerja di dokumen baru.
Setelah itu, dengan magnetic tools/selection tools pilih topi dan bayangannya,tekan ctrl+c dan
ctrl+v sehingga tampak di layer baru tampilannya seperti berikut :
Geser topi tersebut ke sebelah kanan dengan menggunakan move tool
menjadi seperti berikut :
sehingga
STMIK Jayakarta
11
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Menggunakan clone stamp tool seperti pada pertemuan pertama anda bisa menghilangkan
topi di posisi awalnya, sehingga seperti berikut :
STMIK Jayakarta
12
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 3 : Font & Brushes
Untuk menambahkan font dan brushes anda bisa download terlebih dahulu jenis font yang
diinginkan biasanya berekstensi ttf ataupun otf. Kemudian untuk brushes anda bisa download
file berekstensi .abr melalui internet.
Setelah didownload anda bisa menginstalnya.
Instalasi Fonts :
Misal kita download fonts melalui http://www.1001freefonts.com/ :
Extract file zipnya, kemudian tekan install :
Maka otomatis fonts tersebut akan ter-copy ke c:/windows/fonts
Instalasi Brushes :
Contohnya Download
photoshop-brushes.html
dari
http://graphic-identity.blogspot.com/2007/11/fantasy-floral-
Extract file.rar, double click file .abr-nya maka fantasi floral langsung tersedia di brushes
tool:
STMIK Jayakarta
13
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Mulai membuat gambar, klik file->new , set opsi seperti berikut :
STMIK Jayakarta
14
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pada dokumen baru buat warna latar gradasi dengan cara :
Drag secara diagonal pada lembar kerja sehingga hasilnya :
STMIK Jayakarta
15
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Klik brush tools, pilih brush rumput
Set warna brush menjadi hijau tua dan muda :
STMIK Jayakarta
16
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Klik and drag pada lembar kerja sehingga menghasilkan :
STMIK Jayakarta
17
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pilih brush dan kecilkan :
Atur warna foreground agar putih. Sehingga hasilnya :
STMIK Jayakarta
18
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pilih teks tools, set :
Ketik Indonesia Satu kemudian atur warnanya :
STMIK Jayakarta
19
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pilih layer teks, pada layer style pilih stroke :
STMIK Jayakarta
20
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Kemudian dengan teks tools set :
Buat tulisan “peace,love,and respect” hasilnya :
STMIK Jayakarta
21
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 4 : Bola Magic dengan Gradient Color
Buat Dokumen Baru dengan Preset Size 640 x 480 pixels, 72 dpi, dan background
transparent. lalu Buat lingkaran menggunakan "elliptical marque tool", tekan tombol [Shift]
dan [Alt] untuk membuat lingkaran dari tengah dan bulat sempurna
Sekarang kita akan membuat 'gradient circullar', untuk menentukan warna terserah kreativitas
anda masing-masing, tetapi modenya normal dan opacity 100%. Klik dan tahan dari tengah
lingkaran ke arah luar,biarkan saja jangan dideselect
Buat layer baru ganti gradient menjadi seperti ini: linier, "foreground to transparan", set
warna
"foreground"
menjadi
putih
Gradient linier
Pilih Layer baru
STMIK Jayakarta
22
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Klik
dan
tahan
gradient
tool
dari
atas
ke
bawah
dengan
putih
diatas
Gradient transparan Tekan tombol Ctrl+T untuk free transform. Atur sehingga menjadi
separo (tarik bagian bawah ke atas sampai separuhnya,atur bagian kanan dan kiri sehingga
terlihat seperti gambar di bawah ini)
Tambahkan
efek
Gaussian
(
Filter>>Blur>>Gaussian
Dan Hasilnya:
blur
agar
Blur
terlihat
sebesar
lebih
1.3
realistis
)
’
STMIK Jayakarta
23
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 5 : Penggunaan Filter
Dokumen Baru :
Kemudian ubah layer menjadi berawan dengan cara klik Filter » Render » Clouds
Ubah pengaturan pixel’a dengan menggunakan Filter » Pixelate » Mosaic, atur Cell Size
menjadi 15 square
STMIK Jayakarta
24
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Kemudian atur Radial Blur Filter
Blur Method : Zoom Quality : Good
»
Blur
»
»
Accented
Radial
Blur,
Amount
:
20
Hasil:
Kemudian Filter
Edge
Smoothness : 5
»
Brush
Strokes
Brightness
Edges,
:
Edge
Width
:
3
30
STMIK Jayakarta
25
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Hasil :
Kemudian Filter » Stylize » Find Edges,
Kemudian
Image
»
balikkan
Adjustment
warna
»
Invert
berlawanan
(CTRL
(invert)
+
I)
STMIK Jayakarta
26
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertajam garis pipa dengan menggunakan Auto Levels Image » Adjustment » Auto Levels
(SHIFT
+
CTRL
+
L)
Dan
langkah
terakhir
yang
harus
dilakukan
adalah
mengatur warna layer dengan menggunakan Hue/Saturation Image » Adjustment »
Hue/Saturations (CTRL + U)
*jangan
lupa
untuk
men-ceklis
Colorize..
STMIK Jayakarta
27
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Apa bila pengaturan mengikuti gambar di atas..maka hasilnya akan seperti ini..
Pertemuan 6 & 7 : Tugas
Mahasiswa diharapkan mampu mengkombinasikan efek layer style dan filter menjadi
sebuah spanduk atau reklame.
Pertemuan 8 : Ujian Tengah Semester
STMIK Jayakarta
28
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 9 : Membuat Cover majalah
Buka Adobe Photoshop
Buat Layer baru dengan cara CTRL+N pada keyboard masukkan ukuran 600X800 Px. dan
resolusinya 72px.
Duplicate layer background dengan menekan CTRL+J sehingga akan muncul "layer 1".
Aktifkan Gradient tool pada tool box dan atur warnanya pada gradient editor di pojok kiri
atas untuk mengubah warna dan ubah warnanya menjadi warna hitam dan hijau kehitamhitaman, atau terserah anda warna bebas sesuai selera anda. Perhatikan gambar.
wana menjadi :
STMIK Jayakarta
29
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Drag Gradient tool pada area kerja hasilnya seperti pada gambar :
Buat layer baru dengan masuk ke menu Layer => New => Layer beri nama layer 2. Dan
aktifkan
Brush
Tool
pada
Tool
Box.
Pada area kerja, klik kanan dengan mengunakan Brush Tool dan pilih brush rough round
bristle,
master
diameter
44
px
Pada layer 2 masuk ke menu Blending Options dengan cara klik kanan layer 2 => Blending
Options
maka
akan
muncul
layer
style.
Pada Layer Style klik Inner Glow dan Outher glow. Untuk Inner glow : Blend Modenya
screen, warna hitam, Choke 4, dan size 29 px
STMIK Jayakarta
30
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Dan untuk Outher Glow : Spread 1, size 18 px
Drag
Brush
pada
bagian
atas
layar
hasilnya
seperti
berikut:
STMIK Jayakarta
31
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Berikan Tulisan di atas garis dengan tulisan "Special Edition" denan Text Tool biar kayak
majalah-majalah
gitu..
hhehe,.
Jenis tulisan bebas, yang penting menuut anda menarik dan persis majalah umumnya.
Contoh :
(efek yang digunakan pada tulisan sama dengan efek yang digunakan pada brush tadi yaitu
dengan blending options Inner dan Outer Glownya di aktifkan dan atur sesuai selera :) )
Karena tugasnya bertema Multimedia komunitas, maka tambah tulisan lagi "Multimedia
Comunity" pada bagian bawah majalah denan mengunakan efek yan sama pada teks di atas.
Agar lebih menarik,tambahkan gambar hasil editan pada backgroundnya.Contoh saya
menggunakan
gambar
yang
saya
search
dari
google.
Ini
dia.
STMIK Jayakarta
32
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Caranya masukan gambar tersebut kedalam photoshopdan drag ke area kerja membuat cover
majalah
tadi.
atur
posisi
gambar
seperti
dibawah
ini.
Ubah Opacity dari gambar tersebut menjadi 50% dan fill 50% maka aka seperti gambar
berikut.
STMIK Jayakarta
33
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Kemudian berikan lagi tulisan
"All About Multimedia" atur seperti pada gambar.
Berikan sedikit gambar pada pinggir teks Special Edition .
dan seperti inilah hasilnya.
STMIK Jayakarta
34
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Selanjutnya kita buat teks yang mengambarkan isi dari majalah ini, isinya misal meliputi
tutorial Adobe photoshop, Adoe flash Corel Draw, Adobe Premiere dan banyak lagi.
Seperti cara-cara diatas, gunakan text tool dan ketikan semua tutorial pada cover depan ini.
Dan terahir kasih bar code dengan Fonts ID Automation.
STMIK Jayakarta
35
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 10 : Web Design
Jalankan aplikasi photoshop anda dan siapkan sebuah kanvas baru, caranya pilih file new lalu gunakan setting berikut: Width : 700 pixel Height : 875 pixel Resolution : 72
pixel/inch Background Content : Transparent
STMIK Jayakarta
36
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pilih rounded
retangle
tool pada tool
panel
dan samakan setingan dengan gambar dibawah kemudian buat bidang berbentuk segi panjang
vertical seperti pada gambar dibawah
Pilih layer click kanan pada layer 1 (bidang yang anda buat) kemudian click gradient dan
pilih gradasi warna yang anda sukai. pastikan warna bawah adalah warna dasar putih
Hasil dari gradasi yang anda buat akan menghasilkan gambar seperti berikut :
STMIK Jayakarta
37
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
buatlah bidang untuk panel menu dengan rounded retangle tool pada tool panelseperti
sebelumnya beri sentuhan warna yang berbeda dengan layer pertama tetapi tidak melenceng
dari tema anda, kemudian tempatkan pada sebelah kiri atas sehingga anda mendapatkan
gambar seperti dibawah ini
STMIK Jayakarta
38
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
buatkan lagi sebuah bidang untuk daftar menu yang kali ini lebih kecil dari sebelumnya
dengan rounded retangle tool pada tool panel, tempatkan sejajar dengan bidang yang anda
buat sebelumnya putarkan sampai arah kemiringan 250 dengan move tool
kemudian copy layer bidang dengan cara tekan ctrl+alt+shift dan geser kebawah sebanyak 4
kali. Beri sentuhan warna pada bidang yang telah anda buat sehingga akan tampak seperti
berikut:
STMIK Jayakarta
39
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Ketik
daftar
menu
gunakan Type
Tool dengan
lambang (T) pada tool
panel
Isi text pada bidang untuk daftar menu dengan : Halaman Utama, Tentang Saya, Galerry Foto
dan Link. Kemudian pada sebelah kanan beri Logo dan judul Website yang sesuai dengan
keinginan anda . Sampai tahapan ini kita sudah berhasil merancang layoutWebsiteku dengan
tampilan sebagai berikut
STMIK Jayakarta
40
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Gunakan Slicetool
kemudian slice Layout website menjadi 6 bagian yaitu : 4 slice untuk daftar menu, 1 slice
untuk logo, dan 1 lagi untuk untuk content/ isi web.
STMIK Jayakarta
41
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Sekarang
anda
tinggal
menyimpanya
saja. Pilih
File->Save
For
Web
dan akan muncul wizard seperti berikut
pada opsi dibawah save, anda bisa menentukan format gambar yang akan di save mulai dari
gif, png, jpg.
STMIK Jayakarta
42
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
apabila sudah memilih sebelum di save beri nama file anda dengan index, pilih opsi HTML
and Images, simpan layout anda pada satu folder yang anda beri nama Websiteku
Sampai sini design untuk layout dengan menggunakan photoshop sudah selesai dan
selanjutnya anda tinggal melakukan mark-up atas file index.html yang telah kita save tadi
dengan Dreamweaver/Notepad++/Netbeans
Catatan Penting : Pembuatan website diatas merupakan salah satu cara perancangan web
yang berbasis Table. selain menggunakan table sebetulnya ada cara lain yaitu dengan
menggunakan Divatau campuran keduanya Div+Table. kedua cara memiliki plus minus
masing-masing dan anda akan mengerti dengan sendirinya seiring dengan pengetahuan dan
pengalaman anda dalam membuat website.
STMIK Jayakarta
43
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 11 : Corel Draw
Jika menggunakan effect Drop Shadow pada corelDRAW Drop Shadow atau object dengan
transparansi, mungkin akan ditemukan problem dalam hal pencetakan dengan printer
komposit (laser printer, inkjet dan sebagainya) meskipun semuanya terlihat baik di monitor,
akan tetapi masih
saja
tidak
dapat
menghasilkan cetakan
yg tepat.
Mengapa
hal
ini
dapat
terjadi.
Cara
CorelDRAW
memperlakukan
transparansi
Di dalam mereproduksi sebuah object yang transparan, CorelDRAW akan membuat gambar
bitmap dari object aslinya yang diberi effect Drop Shadow, seperti pada gambar dibawah ini
Sehingga hasil yg didapatkan adalah bahwa Drop Shadow Bitmap akan mempunyai batas
pada
vektor
object.
Color
Space
Mapping
Pada saat melihat Drop Shadow pada Corel DRAW akan terlihat sempurna apabila dilihat
pada monitor, akan tetapi bila dicetak akan menghasilkan hasil yang tidak sesuai dengan apa
yang ditampilkan pada monitor. Jawaban dari pertanyaan tersebut akan kita coba
membahasnya
di
bawah
ini
Perbedaan alat Output atau Output Device untuk menampilkan reproduksi warna adalah
jawaban yang tepat. Monitor mempunyai tiga unsur warna fosfor yang mempunyai tiga
warna, yaitu red, green dan bluesering disebut RGB. Sedangkan pada peralatan cetak atau
printing device mempunyai teknologi yang berbeda, yaitu mempunyai substraksi warna
STMIK Jayakarta
44
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
tinta Cyan, Magenta, Yellow dan Black yang sering disebutCMYK. Karena mempunyai
teknik yang betul-betul berlainan dalam mereproduksi warna maka bukan hal yang tidak
mungkin bahwa kedua teknik tersebut akan mempunyai cara pandang yang berlainan di
dalam mereproduksi suatu warna alam yang ditangkap oleh mata manusia. Pada
monitor RGB yang modern mempunyai jangkauan warna yang sangat beragam daripada
teknologi printer CMYK, hal inilah yang sering menjadi masalah sangat serius didalam
problem pencetakan. Designer harus selalu memakai cara pandang CMYK didalam
melakukan kombinasi warnanya, bukan dengan standard RGB yang selalu dilihat dalam layar
monitor
Terdapat dua cara untuk menterjemahkan permasalahan warna satu dengan warna yang lain :
1. Gantilah warna yang dekat dengan Output Device daripada yang terlihat pada layar
monitor.
2. Berilah skala warna pada object asli untuk menentukan range warna Outputnya. Akan
tetapi
perbedaan
secara
relatif
pada
warna
akan
selalu
ada.
3. Dua transfer warna secara algoritma dapat dijelaskan pada grafik dibawah ini :
Pada gambar tersebut: S – warna sumber asli, D – warna tujuan, B – range warna yang dapat
ditampilkan output device, E – warna output device yang di skalakan dengan warna
sumbernya
Saat menggunakan metode 1 (grafik kiri), warna pada daerah B dapat tercetak tanpa ada
perubahan. Sedangkan range A dan C dapat diwakili dengan range warna yang mendekati
dengan range B. sedangkan apabila menggunakan metode 2 (grafik kanan), semua warna
yang ditampilkan akan mempunyai hasil yang khas walaupun tidak sesuai dengan warna
aslinya
Metode 1 adalah metode yang paling tepat apabila menggunakan ilustrasi-ilustrasi berbasis
vektor yang tidak menurut range warna yang sangat bervariasi. Pada gambar fotografi distorsi
warna
akan
terjadi
STMIK Jayakarta
45
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Saat CorelDRAW mencetak documment tersebut pada printer komposit, akan menerapkan
alogaritma yang kita bahas diatas. Secara defaultnya metode 1 diterapkan pada gambar
dengan basis vektor, sedangkan metode 2 banyak digunakan untuk gambar-gambar bitmap
Untuk
menanggulangi
bencana
diatas,
dapat
diikuti
petunjuk
dibawah
ini
:
Convertkan object ke bitmap, dari sini dapat dibuat Drop Shadow lebih bagus, atau cetaklah
pada object yang berlainan. Hal penting yang harus diperhatikan adalah, jangan
menggabungkan
vektor
dengan
bitmap
pada kotak warna
yang sama.
Dalam
CorelDRAW,
aturlah
pada
menu Tools,
pilih Option, Global, Color
Management, General dan dapat dilihat pada menu Drop Down dengan nama “Mapping
Mode” (“Rendering Intent”). Dan atur pada“Illustration” atau “Photographic” (“Saturation”
dan
“Perceptual”),
pastikan
jangan
memilih“Automatic”.
Pada driver printer, sebagai contoh Canon iP1800 Series gunakan automatic color secara
defaultnya pastikan mengatur pada dua metode dari pada type digunakan yang otomatis.
Metode 1 sering disebut“Vivid Colors” dan metode 2 disebut “Match Colors On Screen”.
Latihan Praktikum Corel Draw :
Buka Aplikasi Corel Draw. Buatlah beberapa lingkaran seperti gambar dibawah ini
setelah itu seleksi dua lingkaran kiri dan lalu combine (Ctrl+L) lalu beri warna Hitam, dan
buatlah satu lingkaran kecil lagi sehingga seperti pada gambar dibawah ini
STMIK Jayakarta
46
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Groupkan (Ctrl+G) semua lingkaran bagian Kanan, lalu seleksi semua object dan centerkan (
C
).
3. Buat satu lingkaran besar (lebih besar dari lingkaran pertama) dan beri warna putih, letakan
sesuai
keinginan
seperti
pada
gambar
dibawah
ini
hilangkan
4.
Transparasikan
Out
lingkaran putih tadi dengan
Linenya.
menggunakan Transparency tool
STMIK Jayakarta
47
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Lalu
akan
keluar
submenu
diatas,
pilih
radial
Setelah itu, masukan object Lingkaran putih tadi pada lingkaran hitam dengan menggunakan
Power Clip (Effect >> Power Clip >> Place Inside Continer), Letakan Sesuai kehendak,
Buatlah object baru berupa persegi dan gunakan Text Tool lalu klikan pada garis(tepat pada
garis object)Persegi, tulis sesuka hati, Ungroupkan (Ctrl+U) lingkaran kanan pertama tadi
dan seleksilah lingkaran kecil, beriwarna putih dan transparasikan kembali dengan
menggunakan
Transparency
Tool
dan
pilih
linier.
6. Seleksi lingkaran yag tadi satu group dengan lingkaran kecil, lalu klik Effect >> Lens pada
menu
STMIK Jayakarta
48
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Maka
akan
muncul
Docker
Window
seperti
pada
gambar
dibawah
ini
STMIK Jayakarta
49
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pilih Magnify, dan sesuaikan Amount dengan keinginan kita, sehingga menjadi seperti pada
gambar
dibawah
ini
Dan kita tinggal mengexportnya menjadi JPEG untuk membuatnya menjadi bitmap
STMIK Jayakarta
50
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Docker Window : Window yang menampilkan Perintah-perintah yang dapat kita
gunakankembali
saat
kita
melakukan
editing
Hasilnya:
Catatan :
Sedikit permasalahan yang kita alami dalam pencetakan atau print file pada Corel DRAW ,
mungkin catatan berikut ini bisa menjadi sedikit referensi untuk memaksimalkan hasil print
dari CorelDRAW.
STMIK Jayakarta
51
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 12 : Membuat logo Windows Vista dengan Coreldraw
Buka Coreldraw anda dan Pilih New atau tekan Ctrl + N dan buatlah 2 buah lingkaran seperti
gambar (berikut warnanya):
Selanjutnya kita akan membuat efek sinar dengan Interactive Blendtool, lihat gambar:
STMIK Jayakarta
52
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Buat lagi lingkaran kecil dengan warna putih tanpa outline , dan kasih juga efek transparansi
dengan interactive Transparansi Tool
Oke saatnya kita membuat jendelanya: buat kotak dengan rectangle tool, dan miringkan
dengan cara klik tengah pada kotak, hingga titik2 pinggir berubah menjadi seperti ini (drag
dan geser ke kanan):
STMIK Jayakarta
53
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Setelah itu pilih shapetool dan klik kanan pada kotak, kemudian pilih convert line to curves :
Blok kotak kemudian pada property bar pilih convert line to curves:
STMIK Jayakarta
54
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pada garis atas drag ke atas hingga berbentuk seperti pada gambar:
Selanjutnya buat menjadi 4 kotak, bentuk dan warnai seperti pada gambar:
STMIK Jayakarta
55
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Sekarang kita kasih deh efek sinar dengan interactive mesh fill tool, klik salah satu kotak
(maka akan ada kotak2 kecil,kita hilangkan dengan cara mengklik 2x hingga tinggal seperti
pada gambar):
STMIK Jayakarta
56
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Lalu kita warnai pojok2 dalam kotak dengan cara mengklik titik di pojok (lihat gambar),
begitu pula yang lainnya.
STMIK Jayakarta
57
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Oke selanjutnya blok 4 kotak tadi dan pilih interactive drop shadow: dan pada property bar
pilih small glow:
STMIK Jayakarta
58
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Oke sekarang kita gabungkan deh jadi satu: hasilnya seperti ini:
STMIK Jayakarta
59
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
STMIK Jayakarta
60
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 13 : Membuat Logo AC Milan
Aktifkan Ellipse Tool (F7)
kemudian buat objek elips dan beri warna merah.
kemudian buat objek elips lagi tapi ukurannya lebih kecil dengan warna putih dan letakan
ditengah elips merah.
Tips : agar tepat berada di tengah-tengah, pilih saja kedua objek (elips merah dan putih)
kemudian tekan huruf P pada keyboard.
Masih dengan ellips tool, buat objek lingkaran sambil menekan ctrl agar objek benar-benar
bulat. Kemudian kita belah menjadi dua dengan Knife Tool
dengan cara klik di Garis atas dan bawah lingkaran. Setelah menjadi dua bagian, beri warna
merah untuk sebelah kiri dan putih untuk kanan.
Aktifkan Graph paper tool (D)
atur dengan columns=6 dan rows=1
STMIK Jayakarta
61
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
pastikan snap to object
sudah di centang
Buatlah diatas setengah lingkaran merah seperti ini.
Drag
dari
pilih Intersect
paper-nya.
P1
ke
P2
dengan Pick
(View-Snap
Tool
To
Object).
kemudian
pada tool bar kemudian delete Graph
STMIK Jayakarta
62
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pilih setengah lingkaran merah kemudian ungroup (Ctrl+U) atau pada menu ArrangeUngroup dan
beri
warna
hitam
pada
bagian a,
b
dan
c.
Dengan Rectangle Tool (F6)
kita buat dua objek persegi panjang seperti gambar di
bawah
dan
letakan
di
atas
objek
setengah
lingkaran
putih.
Pilih kedua persegi panjang tersebut, caranya pilih P1 kemudian tekan dan tahan Shift pada
STMIK Jayakarta
63
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
keyboard
dan
Kemudian
Pilih
setengah
pilih P2.
di Weld
lingkaran
kemudian pilih Intersect
merah.Delete hasil
putih
dan
objek
yang
kita
dan
Weld
tadi,
beri warna
weld-nya.
Selanjutnya kita buat lingkaran yang sedikit lebih besar dari lingakaran pertama,
kemudian gunakan fasilitas Fit Text To Path yang berada pada Menu Text, kita tuliskan
"ACM" dengan
jenis
font
Verdana
kalo
ukurannya
disesuaikan saja.
Kemudian
gunakan Pick
Tool untuk
memilih Text
Orientation-nya
menjadi
Selanjutnya pisahkan objek lingkaran dan tulisan ACM (Arrange-Break Text Apart) dan
hapus
lingkarannya.
STMIK Jayakarta
64
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Untuk membuat tulisan "1899" sama seperti membuat "ACM" hanya Path-nya bukan
lingkaran
tapi
garis
lengkung.
Caranya : aktifkan Pen Tool
dengan Shape Tool (F10)
Curve
klik di kanan dan kiri (untuk mengakhiri tekan ESC),
klik satu kali pada garis kemudian pilih Convert Line To
Pada garis tengah klik dan drag ke bawah, jika sudah lengkung gunakan Fit Text To
Path pada MenuText dan ketikan "1899" (font=Arial, ukuran=disesuaikan sendiri)
kemudian Arrange-Break Text Apart dan hapus path lengkungnya. Hingga hasilnya kurang
lebih seperti ini.
STMIK Jayakarta
65
Modul Praktikum Lab Program Aplikasi II ( Design Grafis )
Pertemuan 14 & 15 : Tugas
Mahasiswa diharapkan Membuat Kreasi Logo sendiri dengan menggunakan Corel
Draw.
Pertemuan 16 : UAS
Sumber :
http://www.ilmugrafis.com/
Modul Photoshop Informatics
Tutorial pada PCMild
http://www.ahlidesain.com
http://www.w3function.com
STMIK Jayakarta
66