nana johari

January 30, 2013

Graphics : Fonts for posters


Do not re-tutorial

Assalamualaikum.

Tutorial ni lebih menjurus untuk poster fanfic. Aku kongsi ilmu pasal yang basic jelah. Firstly, kena tahu apa tujuan kita letak wordings tu.

Objektif letak fonts/titles/wordings, nak menyampaikan maklumat.
Bila nak menyampaikan maklumat dan nak pastikan maklumat tu tersampai, bentuk fonts, latar belakang, warna fonts, saiz fonts dan susun letak perlu diambil berat.

Meh tengok.

1. Blending


Ni tulisan yang tak dihias apa-apa. Aku just type je.


Ni tulisan yang dah dihias/edit. 

Ikut mata aku, pasti lah yang diedit tu lagi senang dibaca. Cara nak edit fonts senang je. Bila korang dah create layer fonts atau dengan erti kata lain korang dah tekan T tool di toolbox dan type tajuk or apa apa yang nak ditaip, korang right click pada layer tu dan tekan Blending Options. Like this.


Nanti akan keluar tab macam ni.


Cadangan aku.

  • Boleh guna shadow untuk wordings warna cerah yang digunakan di background cerah
  • Guna stroke untuk buat wordings romcom poster tapi jangan guna stroke untuk angst poster. Kalau nak guna stroke untuk angst poster, boleh tapi pastikan ketebalannya tak jelas sangat. 
  • Untuk wordings di background gelap, elok pakai Outer Glow. Kalau tak nak guna Outer Glow, sila duplicate layer font dan tekan layer kedua tu, Filter > Blur > Motion blur. Tarik layer tersebut di bawah layer asal font tadi. Dan tengok, menjadi ke tidak.

Wordings contoh aku tu, walaupun dah diedit, tapi ada something yang tak kena. Jenis font tu. Sekarang masuk perkara yang kedua.


*     *     *


2. Bentuk/jenis fonts


Pernah dengar pasal Roman typefaces dan Monospaced? Entah banyak lagi aku rasa. Semua ni fonts. Dalam kelompok tulisan Roman, ada banyak. Misalnya Serif dan Script. Ni yang paling biasa digunakan.

Serif ada banyak jenis. Sans Serif, Slab Serif dan lain lain. Dalam Sans Serif ada lagi beberapa cabang iaitu nama-nama khas fonts. Contohnya font Clarendon dalam kumpulan Slab Serif dan Myriad dalam kumpulan Sans Serif. Perbezaan antara ketiga-tiga ni boleh rujuk dalam gambar di atas. Slab Serif garisan stroke tu tebal sikit. Sans Serif tak ada serif. 'Serif' yang garis melintang di hujung bentuk huruf tu. Benda ni tak penting sangat pun sebenarnya ahahaha korang just kena ingat 'Serif' tu tulisannya macam mana.

Script ialah kumpulan fonts berangkai. Dalam kumpulan Script ni, banyak kumpulan-kumpulan kecil untuk jenis fonts seperti Handwriting dan Calligraphy. Dalam kumpulan Handwriting dan Calligraphy sebagai contohnya, ada banyak nama-nama khas untuk fonts, misalnya Jenna Sue dan Santos Dumont. Yang korang biasa mintak nama fonts tu lah. Bentuk tulisan pun memainkan peranan penting untuk memudahkan sesuatu maklumat tu disampaikan.


Tekan gambar untuk besar. Ada kumpulan fonts di situ. Credit. Here.

Cadangan

  • Untuk background yang bercorak, elok guna tulisan Serif or tulisan yang gemuk gemuk comel lol macam dalam kumpulan Decorative or Fancy or apa apa lah. Kalau nak guna tulisan Script, pastikan garis tulisan tu tebal dan boleh dibaca macam gambar atas gambar di atas ni lol
  • Kalau untuk background yang tak jelas coraknya or blended well or satu warna plain/kosong, boleh gunakan Script.

*     *     *

  • Untuk poster romcom, elok guna Decorative or Fancy or yang seangkatan dengannya. Yang gemuk-gemuk comel comel tu. 
  • Untuk poster angst, elok guna Serif dan Script. Nampak pro/matang.


*    *    *


Kalau ikut cara aku, untuk tajuk poster yang panjang berjela lebih daripada tiga patah perkataan; contoh, TILL DEATH TEAR US APART /tajuk ni tak sesuai untuk romcom harap maklum ahaha/

  • Romcom poster; tukar jenis fonts untuk beberapa patah perkataan. buat variasi. Misalnya, TILL DEATH dan US dalam font Maggie Moo. TEAR dan APART dalam font Bubble Gum.
  • Angst/romantic poster; buat beberapa patah perkataan dalam tulisan jenis Serif, dan beberapa dalam tulisan Script. Misalnya, TILL, US dan APART dalam tulisan Times New Roman /serif/. DEATH dan TEAR dalam tulisan Some Weatz /script/. 

Contoh tulisan dengan background bergambar/bercorak.


Aku lagi suka yang bawah tu. Senang dibaca berbanding yang atas.


*    *    *


3. Warna

Warna memang mainkan peranan yang penting. Salah satu sebab tulisan susah nak dibaca, ialah sebab warna yang digunakan tak sesuai. Lagi lagi untuk background yang bercorak, macam contoh aku ni.


Susah nak dibaca

Cadangan. Lebih kurang macam apa yang aku cakap tadi kat atas.

  • Untuk background gelap, guna warna cerah untuk wordings. Kalau poster tu ada campur warna merah atau coklat gelap, dan korang nak guna warna merah/coklat sebagai warna wordings, pastikan korang apply Outer Glow
  • Untuk background cerah, guna warna gelap untuk wordings. Kalau korang nak guna warna cerah jugak, sila guna Shadow untuk bagi nampak tulisan tu. Or stroke, tapi untuk stroke ni depends on jenis poster korang. Kalau romcom poster, stroke boleh tebal. Tapi untuk romantic or angst poster, eloklah kalau stroke tak tebal, 1px je macam tu. 


*    *    *


4. Jarak wordings/letters 

Korang boleh buat fonts tu besar kecik dengan adjust saiz. Boleh jugak buat huruf antara tulisan tu rapat dan jarak, boleh jugak buat senget dan tebal. Semua tu boleh adjust di kotak yang aku petakkan merah ni,


Specific function boleh tengok kat bawah ni.


Untuk adjust jarak di antara huruf. Highlight tulisan lepas tu baru tukar jarak yang aku petakkan  belah kanan tu.


Yang ni lebih spesifik. Lol 'spesifik'. Ada huruf yang korang nak dekatkan, ada yang korang nak jauhkan. So guna kaedah ni instead of kaedah atas tu. Korang just click di antara huruf tu, lepas tu adjust yang aku petakkan. 


Ini untuk rapatkan jarak antara perkataan. Type dan tekan enter untuk type satu lagi perkataan, lepas tu boleh adjust jarak di antara kedua-dua perkataan tu.

Seterusnya sila lah kaji sendiri kat buttons yang ada tu.


*    *    *


5. Saiz fonts.

  • Tajuk; aku rasa tak payah lah besar sangat gedabak sampai tutup separuh poster kan lol. Memang kena besar, selalunya lah. Cuma aku tak suka buat tulisan besar-besar sangat lol. 
  • Credits or copyright; korang buat saiz kecik kecik sudah. Tak perlu besar sangat. 
  • Quotes; untuk poster romcom, gunakan fonts yang jenis handwriting or decorative tu. Yang sebiji sebiji hurufnya tu lol. Untuk poster angst/romantic, elok guna tulisan Serif. Script boleh guna tapi susah nak baca. 


Kanan Hazirah punya. 


*    *    *


6. Kedudukan fonts/wordings

Bila dah siap tulis, cara nak bagi sama besar or center, korang boleh guna Rectangular Marquee Tool. Tengok bawah,


Sekarang, nak bagi jarak di bahagian kiri sama dengan jarak di bahagian kanan /yang aku petak merah/. Tekan tool yang aku cakap tadi, then buat bentuk rectangular macam aku buat atas tu. Nanti akan ada garis putus-putus. Biar garis tu bertemu dengan tepi tulisan. Then drag je kotak putus putus tu ke bahagian kanan.

Hasilnya macam ni,


Ada huruf yang termasuk dalam kotak. Jadi tulisan tu patut ke kiri sikit. Adjust lah, then ukur balik. Jangan bagi tulisan termasuk dalam kotak. Yang ni untuk sesiapa yang nak buat tajuk tu center lah.

So tu jelah. Ni aku buat,


'Somebody' is in black with outer glow. 'Who Cares' in white and I've applied drop shadow. Black rectangular with low opacity at the back.

Adios.

January 29, 2013

Graphics : Movie credit PSD


Tulisan banyak banyak kat bottom tu

Assalamualaikum.

Movie credit PSD. Ramai tanya pasal benda ni. Mulanya aku senyap. Ahahaha. Orang pertama yang aku bagitahu pasal benda ni, kat facebook. Ada someone tu tanya aku. Then .. the rest is history and the drama after that also remained as a secret. Dah alang-alang orang dapat tahu. So here,

Pergi bukak google, type je Movie Credit PSD. Walaupun google kadang kadang bajet macam tahu semua, tapi mostly benda boleh jumpa kat google. Selalu aku search kat google image je.

Dah search, bila korang tekan Images, korang akan nampak macam ni. Aku tak boleh bagi movie credit tu kat korang secara terus sebab benda tu bukan aku punya. Boleh ambik yang aku petakkan tu rasanya. Tengok lah dulu owner tu bagi ke tidak. Right click dan save macam biasa.


Upload gambar yang korang nak edit, dan open sekali movie credit tu. Lepas tu drag movie credit tu masuk. Macam ni,


Sekarang cara nak hilangkan border/background hitam tu. Sila tekan pada layer movie credit tu dan ubah mode dia kepada Screen untuk jadi putih. Korang boleh try mode yang lain.


Adios.

January 28, 2013

Type of Fanfic Posters


Assalamualaikum.
Nak buat penerangan simple kejap. Simple ke? Lol.

Sesiapa yang selalu buat poster, memang akan sinonim dengan perkataan 'romcom', 'angst', 'thriller', 'romance' dan lain lain. Ni aku nak share sikit ilmu tak cukup sifat aku pasal jenis jenis poster. Penting nak tahu jenis poster ni supaya bersesuaian dengan jalan cerita. Tak ada lah nanti tersilap buat romcom poster untuk cerita yang sedih kan. Oh ye sorry aku tunjuk poster buruk aku tade contoh lain dah lol.


*     *     *


ROMCOM

Aku rasa nama panjangnya, romantic comedy. Bila sebut romantic comedy, poster tu mesti bright, nampak ceria nampak comel nampak .. nampak macam romantic comedy lah lol. Selalunya untuk buat poster macam ni, designers banyak gunakan kaedah macam INI. Ada jugak yang tak guna. Semua bergantung pada kreativiti masing-masing lah. Majoriti gambar yang digunakan adalah gambar photoshoot untuk magazine or album. HQ. Tulisan banyak guna tulisan yang fancy dan besar besar.

Examples;


Kiri tu Hazirah punya. Sorry weh aku ambik letak sini ahaha ;~:


ANGST

Angst ni lebih kurang macam cerita sedih lah. So ni untuk poster cerita jenis jenis macam tu. Ada tiga jenis sebenarnya. Light angst, normal angst dan heavy angst. Tapi aku pun tak berapa sure cara nak bezakan semua ni ahaha. So panggil jelah 'angst' ye. Yang aku tahu 'heavy angst' tu poster yang ada banyak warna gelap macam hitam dan coklat gelap. Majoriti gambar watak yang digunakan bukan gambar yang senyum tayang gigi. Banyak gunakan tulisan jenis Script dan yang biasa tu

Nah contoh angst,



Yang background hitam tu Hazirah punya ehe


ROMANCE 

Romance ni .. lebih kurang macam cerita yang sweet sweet. Nak cakap sedih pun tak jugak. Tapi just sweet. Entahlah. Korang boleh wiki. Ahaha. Warna yang digunakan selalunya soft colors lah. Cerah cerah. Gambar yang digunakan tak ada lah masam mencuka. Light smile. Banyak guna tulisan Script dan yang biasa.

Contoh;


Kiri Hazirah punya.


THRILLER/MYSTERY 

Dua ni posternya lebih kurang je aku rasa. Warna mesti gelap. Muuuusti. Thriller nampak ganas sikit lah. Mystery nampak .. misteri. Ahahaha. Tak membantu langsung omg. Gambar yang digunakan selalu gambar serius, tak senyum, serius. Gambar riak marah pun okay jugak. Untuk misteri punya, gambar muka takut pun okay jugak. Guna tulisan yang jenis biasa dan Script

Contoh;


Kiri Hnie punya. Kanan Hazirah's. Aku tak buat poster jenis macam ni so aku tak ada contoh lol

Haa..
Ni jela kot jenis poster yang paling basic kot ye pun. Thanks kepada tuan punya posters, aku pinjam letak sini. Lol takpe kan ._. Lawa je posters korang.

Adios.


January 27, 2013

Photoshop : Selective Color


Assalamualaikum.

Macam gambar atas tu. Tengok baju dia. Gambar yang asal bajunya warna lebih kurang macam oren merah tu. Gambar yang telah diedit, yang warna oren. Aku gabungkan. Sebenarnya boleh je tukar jadi warna ungu sekali pun. Tapi aku buat jadi warna oren.

So macam mana nak tukar?
Open Photoshop tak kesah lah CS berapa pun. Open gambar yang nak di-edit.


Untuk kesan yang lagi spesifik /okay aku tak tahu nak panggil apa lol/. Korang guna tool macam dalam gambar atas ni. Lepas tu click pada bahagian yang korang nak tukar warnanya tu. Macam atas ni lah, nanti akan ada garis putus-putus.

Lepas je dah ada garis putus-putus, terus ikut step dalam gambar bawah ni.


Lepas tu nanti akan keluar satu tab. Korang adjust lah kat situ. Misalnya warna asal gambar korang tu warna merah, pastikan dalam kotak kecik tu tertulis 'red'. Lepas tu baru boleh ubah meter warna kat bawah dia. Kalau bahagian yang korang nak ubah tu warna asalnya biru, pastikan 'blue' tertulis kat situ. Lepas tu ubah lah meter warna macam aku cakap tadi.

Macam ni.


Adios.

Photoshop : Hue/Saturation



Assalamualaikum

Aku ada buat tutor ni sebelum ni. Tapi kena re-new. So here. Buat macam gambar atas tu. Macam mana eh aku nak cakap. Nak kurangkan warna sesuatu gambar tu.

Buka photoshop CS berapa pun. Open gambar yang nak di-edit. Dan buat macam bawah ni,


Lepas tu akan keluar benda alah ni. Korang boleh pilih ikut dropbox tu. Drop box ke nama dia ahahaha lantak. Lepas tu adjust anak panah yang kedua dalam tiga level tu. Main main lah dengan benda tu. 


Pastu siap.
Adios.

January 26, 2013

Photoshop : Cara potong gambar ikut bentuk figura



Assalamualaikum.

Ahaha actually istilah 'figura' tu aku dapat lepas aku belajar melukis lol. Ok drop that. Aku tak sure dah buat ke tidak tutor macam ni. Ingatkan nak buat tutor poster terus tapi teringat pasal step crop ni. Malas pulak tiap kali buat tutor poster aku kena explain ._. so here. Buat macam atas tu, bentuk badan orang kat sebelah tu.

First. Open photoshop. Tak kisah CS berapa, semua boleh pakai.
Open gambar yang korang nak. File > Open.

Sebenarnya kan, bagi sesiapa yang tak sedar, nak crop gambar ikut bentuk figura ni banyak kaedahnya.

Kaedah pertama; Guna Quick Selection Tool.
Tekan pada icon, pilih ikut yang aku kotakkan dalam gambar bawah ni. Then click pada figura korang tu sampai garisan putus-putus tu ikut bentuk figura. Lepas tu right click dan tekan Layer Via Cut. Siap.
Kelemahan; cutting punya garisan tak kemas. Kalau nak kemaskan, kena guna eraser tool.


Kaedah kedua; Guna Eraser Tool.
Senang. Pilih Eraser tool kat kotak tools tu. Lepas tu padam background figura kita tu. Macam bawah ni. Kalau nak pilih mata tool tu macam kotak aku buat dalam gambar bawah ni, right click je kat image tadi. Nanti keluar lah. Pilih mata yang sharp sekeliling tu, aku ada petakkan.
Kelemahan; perlukan kesabaran yang tinggi. Dan aku bukan orang yang macam tu so aku tak guna step ni


Kaedah ketiga; Guna Polygonal Lasso Tool
Guna benda ni memang senang lah compared to guna Eraser Tool. Click ikut bentuk figura dan temukan titik pertama dengan titik terakhir. Lepas tu right click dan tekan Layer Via Cut. Dah siap. Kalau nak guna, tool-nya macam bawah ni. Right click pada kotak tool tu, akan muncul other tools.
Kelemahan; Kalau tersilap tekan waktu kita nak sambungkan titik tu, semuanya boleh musnah lol then kena repeat semula balik. Leceh.


Yang aku nak ajar,

Kaedah keempat; Pen Tool
Senang cut, caranya sama macam Lasso Tool tu. Senang cut dan kalau tersilap tekan, boleh undo. Garisan statik.
Kelemahan; Ada benda petak kecik menyukarkan kita nak nampak garisan lol.



*  *  *


So let's start.
Actually kaedah ni Tikah yang bagitahu lol. Dia cakap dia cut guna pen tool. Aku pun pelik, boleh ke cut guna pen tool. Then aku try, boleh pulak. So better guna yang ni lah.


Tool seperti di atas. Click di sekeliling figura dan sila lah buat rupa daripada garisan. Cantumkan titik pertama dan titik terakhir, macam ni, yang ni dalam proses;


Bila titik pertama dan titik terakhir bertemu, dia akan jadi garisan tanpa petak petak kecik tu. Macam bawah ni,


Cara nak cut;
Bila dah cantum macam gambar atas ni, right click pada image dan tekan Make Selection.


Nanti akan muncul garisan putus-putus macam atas ni. Lepas tu korang tekan Rectangular Marquee Tool yang aku petakkan dalam gambar atas ni. Kemudian, right click pada image dan tekan Layer Via Cut.

Maka terhasil lah, dua layer


Nak transparentkan background tu senang je. Korang click mata kat layer background. Macam atas ni. So akan jadi macam bawah ni,


Dah transparent lah kiranya tu.
Kalau nak save gambar ni dan masih kekalkan background transparent tu, save as PNG.

Adios.