• Aug 25 Thu 2011 10:18
  • 聯成電腦講師專欄:無接縫背景素材製作

  • 分享: MURMUR facebook PLURK twitter Del.icio.us

    文/圖、RORY 撰  
    使用軟體、illustrator

    0825pic0001.jpg  

    0825pic0000.jpg   


           一般在製作像桌面連結性圖案,或是網頁連網性圖案之背景圖時,有大部份會考量到載入的速度,如果檔案愈大,相對載入的速度就會愈慢。另外還得考慮到如連續性圖案製作成一般常用的大小640*480 ,或是 1024*768,而只要製作成無接縫的連續圖,就不用考慮到解析度大小的問題與檔案大小的問題了。

         那先來試試看,如果去制作出一張不錯的無接縫圖,請先設定版面大小,因為是要製作成電腦上的用圖而己,色彩模式請設為RGB即可以,版面大小:200*200。(也可以自訂,不過等會了就去改吧!)

    0825pic0002.jpg  0825pic0003.jpg  

    可以先放入先須要的素才,那就不用一個個的去做滙入的動作,置入的圖最好是有透明背景的(去背就要在PHOTOSHOP中製作)。

    0825pic0004.jpg  

    第一步開始囉!把其中一個素圖放在版面的邊綠上,要怎麼放都可以,不過記得是要放在四個角落其中一個,這裡我們先放在左上角處!

    0825pic0005.jpg  

    在做之前先記一下幾個快速鍵。
    SHIFT+F8:變形面版(視窗工具)
    CTRL+C:拷貝(網輯工具)
    SHIFT+CTRL+V:原地貼上(網輯工具)

    先使用CTRL+C:拷貝複製圖案,再使用SHIFT+CTRL+V:原地貼上,這樣子圖才不會變成只有一張在那移動而己。再打開SHIFT+F8:變形面版,這時圖案還是要在選取的狀態之下。接下來,就只要控制變形面版上的X與Y就好了。因為版面是設定200*200所以X與Y的值輸入要以200的數值下去做加減。

    0825pic0006.jpg  

    ●左上
    1.CTRL+C:拷貝
    2.SHIFT+CTRL+V:原地貼上
    3.X:加上200

    0825pic0007.jpg  

    ●右上
    1.CTRL+C:拷貝
    2.SHIFT+CTRL+V:原地貼上
    3.Y:加上200

    0825pic0008.jpg  

    ●右下
    1.CTRL+C:拷貝
    2.SHIFT+CTRL+V:原地貼上
    3.Y:減去200

    0825pic0009.jpg  

    再來做上下邊上的無接綘,上下一定是同一張圖。
    0825pic00010.jpg   
    ●上
    4.CTRL+C:拷貝
    5.SHIFT+CTRL+V:原地貼上
    6.Y:加上200

    0825pic00011.jpg  
     
    再來做左右邊上的無接綘,左右一定是同一張圖。

    0825pic00012.jpg  

    ●右中
    4.CTRL+C:拷貝
    5.SHIFT+CTRL+V:原地貼上
    6.X:加上200

    0825pic00013.jpg  

    而其餘沒切到的圖,放置的位子就由自己的喜好下去放就好了。

    0825pic00014.jpg  

    最後使用[檔案]\[儲存為網頁與裝置用]。輸出的格式最好為GIF或PNG,因為只有這兩個圖形格式有支援透明背景。0825pic00015.jpg  

    而怎麼去做測試呢?我們可以用最簡單的工具,WINDOWS卓面來做測試。在卓面上沒有圖示的地方,按下滑鼠的右鍵,會出現一個快速選單,使用選單的個人化(基本上應是在選單最下方)。

    設定卓面背景,要使用並列顯示,選到所製作好的圖上即可。

    0825pic00016.jpg  

    完成了一張美美的無接縫背景圖了。

    創作者介紹
    創作者 KITTY 的頭像
    KITTY

    KITTY的部落格

    KITTY 發表在 痞客邦 留言(0) 人氣()