4
1.4 Maksud dan Tujuan
Adapun tujuan dari pembuatan tutorial pengenalan Adobe Photoshop dengan animasi 2 dimensi ini adalah sebagai berikut :
1. Dengan adanya tutorial beranimasi tersebut maka pembelajaran akan lebih
menarik. 2.
Memodifikasi pembelajaran menjadi lebih menarik dimana suasana belajar yang biasanya menjenuhkan menjadi menyenangkan.
3. Menjadi suatu aplikasi pembelajaran mengenai Adobe Photoshop.
4. Memancing mahasiswa agar berpartisipasi aktif dalam kegiatan tutorial.
1.5 Metode Penelitian
Kontribusi penelitian penulis bagi pengguna adalah memberikan suatu aplikasi untuk menghibur namun tidak hanya menghibur tetapi tetap mendidik sehingga dapat
memperluas ilmu pengetahuan di bidang Adobe Photoshop.
1.6 Sistematika Penulisan
Secara garis besar tugas akhir ini terdiri dari 6 enam bab dan beberapa lampiran. Adapun setiap bab terdiri dari sub-sub bab. Adapun sistematika penulisan tugas akhir ini
adalah :
Universitas Sumatera Utara
5
BAB I : PENDAHULUAN
Pada bab ini diuraikan secara ringkas pembahasan tentang Latar Belakang, Identifikasi Masalah, Ruang Lingkup Masalah, Maksud dan
Tujuan, Metode Penelitian, dan Sistematika Penulisan.
BAB II : LANDASAN TEORI
Bab ini menjelaskan landasan teori yang meliputi pengertian tutorial, konsep desain, serta beberapa penjelasan mengenai sofware pendukung
yang digunakan untuk pembuatan aplikasi.
BAB III : PERANCANGAN SISTEM
Bab ini berisikan tentang perancangan pembuatan tutorial Photoshop, ‘dimulai dari rancangan sinopsis, konsep turorial, dan proses pembuatan
tutorial photoshop.
BAB IV : IMPLEMENTASI SISTEM
Bab ini menjelaskan tentang implementasi aplikasi yang telah dirancang.
BAB V : KESIMPULAN DAN SARAN
Bab ini merupakan bab yang mencakup kesimpulan dan saran.
Universitas Sumatera Utara
BAB II
LANDASAN TEORI
2.1 Tutorial
2.1.1 Pengertian Tutorial
Tutorial atau tutoring adalah bantuan atau bimbingan belajar yang bersifat akademik oleh tutor kepada mahasiswa tutee untuk membantu kelancaran proses belajar mandiri
mahasiswa secara perorangan atau kelompok berkaitan dengan materi ajar. Tutor adalah orang yang memberikan ilmu kepada anak didik secara langsung, mahasiswa lebih
memahami konsep dan praktek pendidikan non formal yang lebih baik. Tutorial dilaksanakan secara tatap muka atau jarak jauh berdasarkan konsep belajar mandiri.
Konsep belajar mandiri dalam tutorial mengandung pengertian, bahwa tutorial merupakan bantuan belajar dalam upaya memicu dan memacu kemandirian, disiplin, dan
inisiatif diri mahasiswa dalam belajar dengan minimalisasi intervensi dari pihak
pembelajar yang dikenal sebagai Tutor. Prinsip pokok tutorial adalah “kemandirian
mahasiswa” student’s independency. Tutorial tidak ada, jika kemandirian tidak ada. Jika mahasiswa tidak belajar di rumah, dan datang ke tutorial dengan ‘kepala kosong’, maka
Universitas Sumatera Utara
7
yang terjadi adalah “perkuliahan” biasa, bukan tutorial. Dengan demikian, secara konseptual tutorial perlu dibedakan secara tegas dengan “kuliah” lecturing yang umum
berlaku di perguruan tinggi di mana peran dosen sangat besar.
2.1.2 Prinsip Tutorial
Beberapa prinsip dasar tutorial yang sebaiknya dipahami oleh tutor agar penyelenggaraan tutorial yang efektif, dan tidak terjebak pada situasi pembelajaran biasa, adalah:
1. Interaksi tutorial sebaiknya berlangsung pada tingkat metakognitif, yaitu tingkatan
berpikir yang menekankan pada pembentukan keterampilan “learning how to learn” atau “think how to think” mengapa demikian, bagaimana hal itu bisa
terjadi, dsb. 2.
Tutorial harus memiliki langkah proses belajar yang dijalani oleh tutee. 3.
Tutorial harus mampu mendorong tutee sampai pada taraf pengertian understanding = C2 yang mendalam sehingga mampu menghasilkan
pengetahuan create = C6 yang tahan lama. 4.
Segala kuputusan dalam tutorial sebaiknya diambil melalui prosesdinamika kelompok di mana setiap tutee dalam kelompok memberikan sumbang pikirannya.
5. Tutorial harus mampu membuat variasi stimulasirangsangan untuk belajar,
sehingga tutee tidak merasa bosan, jenuh, danatau putus asa.
Universitas Sumatera Utara
8
6. Tutorial selayaknya memantau kualitas kemajuan belajar tutee dengan
mengarahkan kajian sampai pada taraf pengertian yang mendalam indepth understanding.
2.2 Konsep Desain
2.2.1 Prinsip dasar dalam konsep desain
Di dalam konsep desain terdapat beberapa prinsip yang menjadi dasar dalam membuat sebuah design yang baik, yaitu :
1. Prinsip keseimbangan adalah prinsip yang mengatur keseimbangan elemen –
elemen dalam suatu tampilan grafis. 2.
Prinsip titik fokus adalah prinsip yang mengatur keseimbangan elemen – elemen
sesuai dengan titik pusat pandang manusia. 3.
Prinsip Hirarki visual adalah prinsip yang mengatur elemen – elemen mengikuti
perhatian yang berhubungan secara langsung dengan titik fokus. 4.
Prinsip ritme adalah prinsip yang diciptakan dengan mengulang atau membuat
variasi elemen dengan pertimbangan yang diberikan terhadap ruang yang ada diantaranya dan membangun perasaan berpindah dari satu elemen ke elemen
lainnya. 5.
Prinsip kesatuan adalah bagaimana mengorganisasikan seluruh elemen dalam
suatu tampilan grafis.
Universitas Sumatera Utara
9
2.2.2 Layout
Layout adalah suatu tata letak atau susunan dari tulisan ataupun gambar. Sistem layout biasanya menonjolkan warna apa saja yang digunakan, apakah warna cerah, tenang,
ataupun warna – warni berani.
Menata tata letak layout berarti meramu seluruh aspek grafis, meliputi warna, bentuk, merek, illustrasi, tipografi menjadi suatu kemasan baru yang disusun dan
ditempatkan pada halaman kemasan secara utuh dan terpadu.
Ada beberapa faktor penting dalam mendesain sebuah layout, yaitu : 1.
Keseimbangan layout : a.
Mengacu kepada abjad alphabet. b.
Memanfaatkan gambar dinamis dan adanya daya tarik. c.
Pahami pesan – pesan yang sifatnya instuksional. 2.
Titik fokus, menampilkan objek atau topik pada perpotongan garis untuk memfokuskan user pada desain.
3. Konsistensi :
a. Konsistensi terhadap fitur background dan objek yang dibuat.
b. Konsistensi terhadap letak objek agar user tidak bingung.
Universitas Sumatera Utara
10
c. Kosistensi terhadap penggunaan jenis huruf dan warna huruf untuk
menunjukkan. 4.
Kepadatan, kepadatan gambar, objek dan text jangan sampai membingungkan user.
2.2.3 Tipografi
Huruf merupakan bagian terkecil dari struktur bahasa tulis dan merupakan dasar untuk membangun sebuah kata atau kalimat. Rangkaian huruf dalam sebuah kata atau kalimat
bukan saja dapat memberikan suatu makna atau mangacu kepada sebuah objek ataupun gagasan, tetapi juga memiliki kemampuan untuk menyuarakan suatu citra ataupun kesan
secara visual. Huruf memiliki perpaduan nilai fungsional dan nilai estetika.
a Huruf Serif
Jenis huruf ini memiliki garis-garis kecil yang disebut counterstroke pada ujung- ujung badan huruf. Huruf ini lebih mudah dibaca karena kaitnya tersebut
menuntun pandangan pembaca untuk membaca baris teks yang sedang dibaca. Contoh-contoh huruf ini adalah : Garamond, Times New Rowman, Georgia, dan
lain-lain.
b Huruf Sans Serif
Huruf ini memiliki streamline, fungsional, modern, dan kontemporer. Contoh-
Universitas Sumatera Utara
11
contoh huruf ini antara lain : Arial, Century Gothic, Futura, dan lain-lain.
c Huruf Blok
Jenis huruf adalah tebal, ketebalannya lebih besar besar dari huruf serif dan sans serif. Oleh karena itu, jenis huruf ini sering digunakan dalam pembuatan headline
ataupun judul berita pada surat kabar. Contohnya antara lain : Haettenschweiler, Arial Black, dan lain-lain.
2.2.4 Warna
Warna adalah suatu bentuk cahaya atau radiasi gelombang elektromagnetik, yang dihasilkan dari cahaya matahari yang berwarna putih murni. Mata manusia dapat melihat
warna setelah cahaya matahari melewati sebuah prisma yang membiaskan dan memisahkan cahaya tersebut menjadi 7 frekuensi gelombang cahaya yang berda yaitu:
merah, jingga, kuning, hijau, biru, nila, dan ungu. Jadi seseorang bisa melihat warna berkat adanya cahaya masuk ke mata. Itu pula sebabnya manusia tidak dapat melihat
warna dalam ruang gelap tanpa cahaya.
Salah satu cara paling populer untuk memahami pembagian warna-warna adalah dengan mengenal lingkaran warna. Pada lingkaran warna dasar terdapat 12 warna terbagi
atas:
Universitas Sumatera Utara
12
a. Primer, warna primer terdiri atas warna merah, biru dan kuning. Disebut primer
karena tidak dapat dari campuran diperoleh dari campuran warna-warna lainnya.
b. Sekunder, warna sekunder diperoleh dengan mencampur 2 warna primer yaitu:
kuning dengan merah menghasilkan oranye, kuning dengan biru menghasikan warna hijau, biru dengan merah menghasikan ungu.
c. Tersier, warna tersier diperoleh dengan mencampur warna sekunder dan warna
disebelah lingkarannya, kuning dengan oranye menghasilkan kuning oranye, merah dengan oranye menghasilkan merah oranye, kuning dengan hijau
mengasilkan kuning hijau, biru dengan hijau menghasilkan biru hijau, biru dengan ungu menghasilkan biru ungu, merah dan ungu menghasilkan merah ungu.
2.2.4.1 Karakter Warna
Seperti manusia, warna juga memiliki karakter dan kepribadian menjadikannya unik dan berbeda dengan lainnya.
a. Karakter Tenang Calm, terdiri dari warna lembut dan elegan, menciptakan
suasana sejuk,
dingin, menenangkan
dan mengundang,
membantu menyeimbangkan emosi dan menghilangkan stress. Warna yang termasuk
golongan ini adalah: biru muda, biru pucat, biru laut,ungulila, hijau daun, hijau muda, hijau pupus.
b. Karakter Hangat Warm, terdiri dari warna-warna naturalhangat yang mampu
menghadirkan suasana yang hidup, hangat, nyaman, dan mengundang, memberi
Universitas Sumatera Utara
13
sentuhan dramatis atau kesan etnik kontemporer. Menimbulkan rasa akrab, hangat, tentram, dan nyaman. Warna yang masuk golongan ini adalah: Merah, coklat,
oranye, emas metalik. c.
Karakter Segar Fresh, terdiri dari warna segar yang ceria dan berjiwa muda, banyak mengambil inspirasi dari alam, Bersemangat dan penuh vitalitas. Warna
yang termasuk golongan ini adalah: kunig muda, kuning lemon, hijau daun, hijau apel, biru laut merah cerah, pink mudapastel.
d. Karakter Berani Vibrant, terdiri dari warna-warna cerah yang tegas, kontras dan
berani. Menimbulkan kesan modern, kontemporer, ekspresif, dan menciptakan efek dramatis. Warna yang termasuk golongan ini adalah: kuning menyala, hijau
tua, biru tua kehijauan, biru menyala, biru gelap pekat, merah cerah, oranye menyala, pink tua, hitam dan putih.
2.2.4.2 Asosiasi Warna
Merah dapat membangkitkan energi, hangat komunikatif, aktif, optimis, antusiasi dan bersemangat, memberi kesan sensual dan mewah, menigkatkan aliran darah dalam tubuh,
dan berkaitan dengan ambisi. Terlalu banyak warna merah bisa merangsang kemarahan dan agresivitas. Sejuk, tentram hening dan damai, memberikan kenyamanan dan
perlindungan. Warna ini juga diasosiasikan dengan kesan etnik, antik, country-style. Warna biru yang kuat bisa merangsang kemampuan intutif dan memudahkan meditasi.
Tapi berhati-hatilah, karena terlalu banyak biru bisa menimbulkan kelesuan.
Universitas Sumatera Utara
14
Ungu dekat dengan suasana spiritual yang magis, mistsi dan misterius, dan mampu menarik perhatian. Oleh karena itu, ungu banyak digunakan oleh kaum
bangsawan. Warna ini juga berkesan sensual, feminim, antik yang juga anggun, dan hangat. Ungu yang gelap dapat melancarkan kekuatan, bisa menambah kekuatan intuisi,
fantasi dan imajinasi, kreatif, sensitif, memberi inspirasi, dan obsesif.
Coklat merupakan warna netral yang natural, hangat, membumi dan stabil, menghadirkan kenyamanan, memberikan kesan anggun dan elegan. Dengan memberi
keyakinan dan rasa aman, coklat merupakan warna yang akrab dan menenangkan, bisa mendorong komitmen, namun bisa menjadi berat dan kaku bila terlalu banyak.
Putih melambangkan kemurnian dari kepolosan, memberikan perlindungan, ketentraman, nyaman, dan memudahkan refleksi. Namun terlalu banyak putih bisa
menimbulkan perasaan dingin, steril, kaku, dan terisolir.
Hitam adalah warna yang kuat dan penuh percaya diri, penuh perlindungan, maskulin, elegan, mewah dan dramatis, juga menimbulkan rasa tertekan.
Abu-abu termasuk warna netral yang dapat menciptakan serius, juga menentramkan dan menimbulkan perasaan damai. Kesan lain adalah independen dan
stabil, menciptakan keheningan dan kesan luas. Abu-abu juga berkesan dingin, kaku, dan tidak komunikatif.
Universitas Sumatera Utara
15
2.2.5 Shape Bentuk
Bentuk halaman merupakan pendukung utama yang membantu terciptanya seluruh daya tarik visual. Namun tidak ada prinsip baku yang menentukan bentuk fisik
dari sebuah tutorial karena ini biasanya ditentukan oleh sifat produk, pertimbangan mekanis, kondisi marketing, pertimbangan pemanjaan dan cara penggunaan dan cara
tutorial tersebut.
2.3 Sofware Pendukung Tutorial
Dalam pembuatan aplikasi tutorial dibutuhkan software pendukung, pembuatan tutorial dimulai dari desain tampilan layout, proses recording materi yang akan dibahas yaitu
pengolahan citra, kemudian finishing dengan animasi pada layout dan menciptakan efek sound. Software pendukung dalam pembuatan tutorial ini adalah sebagai berikut :
2.3.1 Adobe Photoshop CS3
Adobe Photoshop
CS3 merupakan
program yang
berguna dalam
proses retouchingmanipulasi fotogambar. Objek yang diolah dalam Adobe Photoshop CS3
dianggap kumpulan pixeltitik dengan kerapatan warna tertentu, misalnya: foto. Foto memiliki dibuat dengan kumpulan titik – titik dengan warna dan kerapatan tertentu. Akan
Universitas Sumatera Utara
16
tetapi Adobe Photoshop CS3 juga dapat membuat garis, huruf dan semua objek yang dapat diolah program pengolahan vektor.
Adobe Photoshop CS3 dapat membuktikan bahwa software desain grafis ini adalah program yang terbaik pada berbagai negara. Hal ini yang menyebabkan Adobe
Photoshop CS3 menjadi program universal bagi desainer dunia dalam menunjang keindahan desain mereka baik itu untuk keindahan desain halaman web, multimedia, dan
hasil kerja desain grafis. Kesempurnaan Adobe Photoshop CS3 dapat dilihat dari kelengkapan tool – tool yang disediakan. Terutama dalam pengolahan pixel Adobe
Photoshop CS3 sangat diandalkan.
Keunggulan Adobe Photoshop CS3 hal mendasar yang perlu digaris bawahi adalah kemudahan dan Efisiensi di dalam mendesain halaman layout desain merupakan
kekuatan yang ditawarkan Photoshop CS3. Dengan menggunakan photoshop CS3, anda dapat leluasa berkreasi mendesain gambar tersebut, serta melakukan pengeditan gambar
secara optimal.
Adobe Photoshop CS3 menyediakan tool – tool yang mendukung pembuatan dan manipulasi image yang akan digunakan di dalam halaman layout desain. Banyak
kemudahan dan keuntungan dalam mendesain layout dengan menggunakan Adobe Photoshop CS3, diantaranya dapat membagi image menjadi potongan – potongan image,
memberikan berbagai efek visual gambar sehingga gambar menjadi lebih hidup dan yang
Universitas Sumatera Utara
17
lainnya.
Gambar 2.1 Jendela Tampilan Adobe Photoshop CS3
Adobe Photoshop CS3 juga memiliki keunggulan untuk melakukan proses desain berbasis vektor. Dimana penggunaan vektor dalam Adobe Photoshop CS3 ini adalah
object oriented. Shape sangat mudah untuk melakukan proses desain seperti seleksi, resize, drag, dan beberapa proses desain lainnya terkait dengan pewarnaan. Selain itu,
vector atau shape dalam Adobe Photoshop CS3 memiliki resolution independent, artinya ia mampu memberi batasan warna yang jelas pada setiap objek.
Universitas Sumatera Utara
18
Jendela Adobe Photoshop terdiri beberapa bagian Yaitu :
1. Baris Menu Menu Bar , berisi barisan perintah brupa menu, seperti menu File,
Edit, image, layer, Select, filter, View, Window dan Help. Baris menu ini
terkelompok berdasarkan topiknya. 2.
Toolbox, berisi tombol – tombol yang mewakili alat atau peranti yang digunakan
untuk membuat dan menyuting objek. 3.
Baris Option Option Bar , berisi tombol – tombol pengaturan tambahan,
sesuai dengan toolbox yang sedang dipilih. Sebagai contoh apabila memilih piranti lasso tool pada toolbox, baris option akan menyesuaikan untuk lasso tool.
Tetapi bila baris option ini tidak tampil, dapat ditampilkan dengan memilih menu
Window Options.
4. Canvas, merupakan jendela kerja yang digunakan untuk berkreasi atau menyuting
image. 5.
Palleters, digunakan untuk memilih dan mengatur berbagai parameter ketika
sedang menyuting suatu image. Untuk menampilkan palet dapat dilakukan dengan memilih menu window, kemudian pilih palet yang diinginkan.
6. Baris Status Status Bar , menampilkan berbagai infomasi tentang objek dan
perkakas yang sedang dipilih. 7.
Icon kontrol menu Control Menu Icon , digunakan untuk mengotrol
jendela yang sedang aktif.
Universitas Sumatera Utara
19
8. Baris Judul title Bar , berisi barisan nama program aplikasi dan nama file yang
sedang aktif. Baris judul ini dapat juga digunakan untuk memindahkan jendela ke posisi lain yang diinginkan.
9. Tombol Ukuran Sizing Button , untuk mengatur ukuran jendela kerja
Photoshop.
2.3.2 Adobe Flash CS3
Adobe Flash CS3 merupakan software animasi 2 dimensi, versi terdahulunya adalah Macromedia Flash 8, kemudian sekarang lisensinya telah dibeli oleh perusahaan software
multimedia Adobe. Adobe Flash CS3 merupakan software yang menjadi idola didunia desain dan animasi. Software Adobe flash mampu menarik perhatian kalangan desainer
animasi. Cara kerja software Adobe flash dengan mengunakan timeline frame by frame dan dilengkapi dengan action script yang digunakan dalam pemrograman animasi.
Software yang digunakan untuk menciptakan animasi dalam multimedia ini sangat sederhana namun mempunyai kualitas yang bagus. Dan mampu eksis diantara software –
software animasi lainnya. Keunggulan Adobe Flash adalah kelengkapan tool – tool yang disediakan oleh software ini. Saat ini tidak hanya untuk membuat sebuah animasi kartun
saja, namun dengan kemampuan grafisnya serta dukungan pengolahan data maka Adobe Flash mampu membuat iklan pada website, company profile, tutorial interaktif, video
clip, katalog yang dapat dikemas juga dalam CD-ROM.
Universitas Sumatera Utara
20
Terutama dalam pembuatan tutorial interaktif, Adobe Flash sangat handal, baik dalam mendesain tampilan layout, perintah action script, serta mengemasnya dalam
bentuk offline via CD – ROM ataupun online via website. Tutorial dapat dikemas secara unik, namun tetap mengandung unsur pembelajaran yang interaktif. Disertai
animasi akan memudahkan pemahaman seorang pemula untuk mempelajari tutorial yang penulis desain ini.
Gambar 2.2 Jendela tampilan Adobe Flash CS3
Adapun beberapa komponen yang dimiliki oleh Adobe Flash CS3 adalah : 1.
Stage Stage merupakan daerah yang bewarna putih, dimana area kerja utama jika
anda ingin membuat animasi maupun aplikasi flash lainnya. Seluruh
Universitas Sumatera Utara
21
objekgambaranimasi yang ada di stage nantinya akan tampil di flash movie. 2.
Tool Merupakan kumpulan alat gambar dan mewarnai sesuatu yang ada di stage.
3. Panel
Merupakan kumpulan kotak-kotak yang berfungsi untuk mengubah, mengatur dan mempercantik objek yang ada di stage. Misalkan memberi warna gradasi,
meletakkan objek persis di tengah stage, dan merotasi objek dengan sudut yang tepat.
4. Property inspector
Merupakan bagian informasi objek yang ada di stage. Sebagai contoh, klik saja salah satu objek di stage, maka informasinya akan terlihat disini. atau klik
saja di daerah kosong yang ada di stage, maka informasi mengenai stage akan terlihat.
5. Timeline
Timelime terdiri dari baris dan kolom. Kolom berhubungan dengan waktu, baris berhubungan dengan objek. Setiap software animasi pasti memiliki
timeline untuk mencatat aktivitas objek kapan harus tampil di stage dan kapan harus menghilang.
Universitas Sumatera Utara
BAB 3 PERANCANGAN SISTEM
3.1 Sinopsis
Rancangan sinopsis tutorial terdiri dari : a.
Pembuatan Layout : pembuatan layout agar lebih menarik di sajikan
menggunakan baground, baground ini di buat pengunakan Adobe Photoshop, lalu di import ke Adobe Flash.
b. Intro Opening
: intro opening adalah pembukaan sebelum masuk pada scene tutorial. Intro opening dimulai dengan animasi dua dimensi berupa
objek maupun teks dan diiringi oleh musik disco sebagai intro. Serta tombol enter untuk masuk kedalam scene tutorial. Dimana tombol enter tersebut telah diisi
sound. Tujuan intro opening ini adalah untuk membuat tutorial lebih menarik dan sebagai scene pembukaan untuk tutorial Adobe Photoshop tersebut.
c. Bagian isi tutorial
: bagian isi tutorial adalah halaman tutorial yang
terdiri dari tombol yang berisi materi tutorial pengenalan Adobe Photoshop.
d. Closing
: bagian closing tutorial adalah halaman tutorial yang terdiri dari judul tugas akhir penulis, ucapan terimakasi, serta tombol untuk kembali ke materi
tutorial pengolahan citra.
Universitas Sumatera Utara
23
3.2 Konsep Tutorial 3.2.1 Skema Layout Bagian Intro Tutorial