破格設計

Posted on 十二月 04, 2009 by 徐老師

這個範例在許多的網站都有看過,剛好最近的Photoshop正在更新新的教材,所以就以這一張來讓同學練習套索及摘取工具,最終的目標是要完成一張1280*1024的桌面,但這就僅以圖片中會用到的效果來教學。

Setp.1  開啟準備給同學的圖檔!

Setp.2  使用鋼筆工具進行去背處理!(教學中是以套索及摘取進行選取),但因這我習慣用鋼筆!所以建議用鋼筆會比較方便。

Setp.3  鋼筆工具選好即可在路徑面版中看到一選取路徑,此時按住鍵盤的Ctrl鍵+滑鼠點路徑中的縮圖,即可得到選取區。

Setp.4  點回圖層中的背景,按快速鍵Ctrl+J,即可將選區範圍選出,得到青蛙的去背圖像。

Setp.5  先將背景拷貝一份(這是一個好習慣),以免後面做錯又要復原!

Setp.6  使用標準選區工具中的矩形,在拷貝的背景中作用,選出一個矩形的範圍(注意此範圍不包含眼及臀部)!

Setp.7  得到選取區後請按Shift+Ctrl+I進行反轉選取,選好後按Delete將選取部份刪除,即可得到下圖!

Setp.8  此時新建圖層後,填入白色當背景!

Setp.9  選取已去背的青蛙圖層,使用Fx樣式設定陰影!

Setp.10  使用剪裁工具,將圖面做適當剪裁!

Setp.11  即可完成圖面,存檔即可!

funP udn Yahoo! Delicious Digg Filed under 平面設計 | 0 迴響 | Permalink

Photoshop實用工具

Posted on 十二月 04, 2009 by 徐老師

Photoshop實用工具~Zoomify外掛

相信各位應該都有在網路上看過一些圖片是可以調整縮放的,有點類似Google Maps中的地圖縮放,剛看到或許會絕的很難,或許會想到用Flash製作,但從Photoshop CS3版開始,增加的一個第三方的工具,讓使用者可以很快的製作好縮放圖面,且匯出後就是Flash,讓您可以自由的控制喔!

Setp.1  打開您的圖片或是由網路上抓一張地圖下來!


Setp.2  因抓的圖檔不夠大張,所以我用Photoshop的影像尺寸調整。


Setp.3  將圖像調到寬度1024。(不建議這樣做,因或多或少會失真)


Setp.4  調好尺寸後到  檔案->轉存->Zoomify


Setp.5  開啟工具進行設定。

範本:有兩種方式,其中具導覽器的範本是左上方會有縮圖,目前的範例是以無導覽器的方式。
資料夾:設定輸出位置。
基本名稱:輸出名稱。
影像拼貼:設定品質。
瀏覽器:設定控制器的大小。


Setp.6  輸出後會有一網頁檔及一資料夾,資料夾中即有Swf檔&圖檔資料夾&Xml檔。


Setp.7  開啟網頁檔即可看到縮圖功能。



(最小尺寸)

(最大尺寸)


Setp.8  如要將縮圖置入到您的網頁中,只要將資料夾複製到網站中,並調整Flash媒體的位置即可!

(以上地圖圖片版權歸Google Maps所有)

funP udn Yahoo! Delicious Digg Filed under 網頁設計 | 0 迴響 | Permalink

配色網站教學

Posted on 十二月 04, 2009 by 徐老師

相信許多同學在設計作品或是網站時,往往最頭痛的問題就是配色!雖然坊間有許多的配色書籍,但好像又不知道該買那一本或是不知由那下手!

所以今天要來介紹一個網站,讓您不用買書,也可以配色,且這一網頁資料已有外掛,可以掛到Fireworks中!

Setp.1   網址:http://kuler.adobe.com 此網站是Adobe公司所有!

本站必需要先註冊,取得帳號才可將您的配色儲存!

下圖是登入後的畫面!

Setp.2   註冊教學 註冊時會另開一個視窗至Adobe的網站進行註冊,此處是英文版,所以請您依下方的範例進行註冊!

 

Setp.3  有標紅色*字的部份一定要填!

Setp.4   填好後的範例,再到最下方按"Continue"即可,其它選項可不勾選!

Setp.5  如果送出後有出現此訊息,表示您的電子郵件有問題,所以多試幾次或換電子郵件!
              (PS:我用Hinet及Hotmail都不行,最後是用Yahoo的才可以,所以可以用Yahoo先試)

Setp.6  回網頁頁面登入。

Setp.7  點選Create進行色彩創造。

Setp.8  進入創造頁面後,即可以紅色區域選單進行配色的選擇,每個色彩在下方都會有色彩的值可供參考。

Setp.9  創建好後,點選Save進行配色儲存供日後使用!未來您可在MyKuler中找到自己的配色。

此配色軟體只是一個工具,基本上您還要有基本的配色概念,這樣配出來的色彩才足以應用!

PS:以上只針對配色部份解說,當然您還可以看一下網友的配色。另英文翻譯部份,如有錯誤請指正,我會盡快更正!

Rod老師介紹

Posted on 十二月 04, 2009 by 徐老師

姓名: Rod
電子郵件:rodteacher@hotmail.com
經歷:2000~2002.09  巨匠電腦教育中心 講師
            2002~2004.08  巨匠電腦教育中心 專講
            2004~2006.10  巨匠電腦南投分校 主任
            2006.10~迄今  巨匠電腦教育中心 專講
專長課程:
    電腦繪圖系列:AutoCAD 2D&3D‧Solidworks‧Inventor‧3ds max
    美工設計系列:Photoshop‧Illustrator‧Indesign‧CorelDRAW‧Painter‧Fireworks
    網頁設計系列:Dreamweaver‧Flash‧ASP
    辦公室應用系列:Word‧Excel‧Powerpoint‧Outlook‧Visio‧Project
    其它:電腦硬體維修‧作業系統‧網路安全‧攝影
授課經歷:
    日商丸紅企業
    鋸眾資產管理公司
    南山人壽
    矽品電子公司
    台中縣政府
    南投縣政府警察局
    行政院勞委會中區辦公室
    水利署
    林務局.....等

funP udn Yahoo! Delicious Digg Filed under other | 0 迴響 | Permalink
最近文章
星期五 十二月 04, 2009
破格設計
星期五 十二月 04, 2009
Photoshop實用工具
星期五 十二月 04, 2009
配色網站教學
星期五 十二月 04, 2009
Rod老師介紹

最近迴響