顯示具有 Cool Web 標籤的文章。 顯示所有文章
顯示具有 Cool Web 標籤的文章。 顯示所有文章

[靈感] Apple style 風格網站設計

我自己的PC已經被我弄得像一台偽Mac,原因無他,實在是太喜歡Mac的設計風格。賈老除了是個了不起的企業經營者,同時他的設計品味也是為大家所崇拜的一點。打從Mac OSX以來,一直到iPod、iPhone誕生,以及新的Mac book問世,Apple 的工業設計、UI、乃至網站設計,無不令人讚嘆!

Apple 的官方網站改版之後,延續Leopard的設計質感,清楚、簡單、而且易用,網站基調是白色的,用灰色來旁襯,放上許多鮮艷、醒目、有趣的產品圖片,凸顯產品價值,更讓整個網站看起來像時尚伸展台,而一部部Mac、iPod、iPhone,則化身成為標緻的模特兒!

Apple-02

清楚、流暢的 Layout 規劃,購物單元逛起來一點壓力也沒有,反而更想一探每個產品的究竟!

Apple-03

Apple-04

Apple-05

Apple-06

大量使用java script,以及搭配QT內嵌影片播放,增添瀏覽網站時的趣味。我也相當喜歡看他們的教學影片,很清楚、簡單,影片的畫質也是沒話說!

Apple 的設計風格如此強眼,無怪乎第3方軟體製造商的網站風格,也多延續這個方向!除了讓使用者一目了然網站是提供服務給 Mac 的軟體商之外,儼然也形成一種網站識別的印象:代表著 Apple 的高品質、簡潔以及高易用性!

以下列出幾個收集來的 Apple 風格的網站,大多是軟體服務商的網站,很酷喔!也許可以幫助激發些什麼靈感,或想法。

1. Panic Coda、Panic CandyBar

Panic-01

Panic-02

相當知名的軟體,網站也是非常有名,在許多 java script 資源網站中,都會拿這2個網站來當範例!使用許多有趣的語法,讓瀏覽網站充滿意思!

2. RapidWeaver

RapidWeaver-01

RapidWeaver-02

令人印象深刻的配色,上方的漸層真的很美!影片播放的時候,也能與背景有所呼應,很棒的設計。

3. Icon Designer

Icon-Designer-01

Icon-Designer-02

提供許多 icon 設計服務,都很精緻有質感!黑色的網站基調與作品相互輝映!

4. MacRabbit CSSEdit

MacRabbit---CSSEdit-01

MacRabbit---CSSEdit-02

CSS編輯軟體,網站很簡單,有大大、醒目的軟體 icon,簡單明瞭!

5. 280 Slides

280-01

280-02

很酷的線上幻燈片編輯服務!看到Mac風格介面,讓人忍不住玩了起來。製作好的投影片還能存成PDF檔下載喔!

6. Versions

Versions

連結軟體的icon意象發想,綠草地讓人印象深刻!

6. Tao Effect

Tao-Effect

能夠將檔案、資料夾、信件加密的軟體。網站形象區結合導覽影片,兼具創意與實用性。黑色與亮綠色的配色,實在讓人著迷!國內使用黑色背景的網站似乎很少,在國外真的超多的。

7. Jumsoft

Jumsoft-02

簡單帶點可愛的網站風格,讓這幾個使用於工作上的軟體看起來格外親切、易用!沒有太多複雜設計的網站,似乎也宣告他們的軟體一樣可以輕鬆上手。

8. Checkout

Checkout-01

Checkout-02

幾乎跟Apple官網一模一樣的設計與layout,讓他的銷售點系統看起來格外可靠、安全!每個功能搭配精緻的情境圖示,像看圖說故事般的讓使用者馬上就能清楚這就是他所需要的產品!

9. Things

Things-01

Mac上的 toDo list 軟體。網站淡藍色的配色讓人感到放鬆,簡單的動線規劃,從下載、購買,到觀看導覽影片一氣呵成。一樣利用醒目的軟體icon來識別,加深印象!

10. AppleStyle

AppleStyle

最後,來看看台灣的吧!這應該算是一個中文介面的Apple商品購物平台吧!介面直接承襲OS Leopard風格,連背景也是 Leopard default 的紫色宇宙。閱讀時會有4個欄位的版型,讓文字過於狹窄,不是很容易閱讀。不過商品的種類倒是挺多的。

Apple 的東西除了外表華麗之外,事實上都兼具有實用性!總是站在使用者角度出發的UI設計,輕巧的機身外殼,親切的操控,化繁為簡,而設計不就是如此嗎!

Read More...

來看看Google、Yahoo、Apple,10年前的樣子

網路發展10年間進步迅速,各種技術應用,以及 Web 2.0 興起,讓網路使用習慣與10年前大不相同!細看網站設計,也有許多大躍進。CSS 應用抬頭、Html 語義化、Flash 3D 強化、各種創意版型設計,讓目前的網站與10年前相較,除了賞心悅目之外,更增添互動的樂趣!前天在國外網站看到幾個知名企業的網站比較圖,讓我們可以檢視這段時間的改變,很有意思!

Apple 2008 V.S. 1998

history_apple2008
history_apple1998

Google 2008 V.S. 1998

history_google2008
history_google1998

Yahoo 2008 V.S. 1998

history_yahoo2008
history_yahoo1998

AOL 2008 V.S. 1998

history_aol2008
history_aol1998

Nike 2008 V.S. 1998

history_nike2008
history_nike1998

IKEA 2008 V.S. 1998

history_ikea2008
history_ikea1998

 

另外,Youtube 上面還有人將這10年 Google 網頁每一天的變化錄製成影片,很厲害!不過 Google 網頁10年來其實變化不大,大部分只是 Google 的 logo 隨著節日變化,呵呵!應該蠻適合晚上睡不著的時候觀看哩。

Read More...

激發創作靈感的的插畫欣賞

整理幾個不錯的個人插畫網站、Blog。看看這些令人驚嘆的作品,不僅可以啟發自己創作時的靈感,也能讓我們思考這些創作背後的意義與技巧,也是很有趣的一件事情!看看他們如何製作的,什麼時候打亮光源,什麼時候利用模糊效果,或是配合照片,讓自己的插畫更具質感。

Alberto Cerriteño

來自美國的插畫家 Alberto Cerriteño,相當喜歡富有朝氣與生命力的設計!目前在波特蘭擔任行銷與設計總監,閒暇時刻就會進行一些插畫創作。很喜歡他的角色,造型可愛,搭配一些材質質感,構圖都相當豐富、多彩,每每讓目光停留、探索更多有趣的地方!

background01_1024

background03_1024

future_1024

tres

Ars Thanea

一個團體創作的設計工作室,喜歡鑽研、著眼於一些嶄新的創作技巧,大量使用 Photoshop 的效果在他們的作品上,給人酷炫到不型的強烈印象,就是他們的風格!像下面這張酒類的海報設計,同樣一個酒瓶瓶身,透過光影效果,就能呈現在4個不同場景的氛圍,相當厲害!

mart_blog

TrashTalk

Stay-Alive  

byroglyphics

來自英國的插畫家 Russ 的作品,充滿張力的線條,像來自人體的靈魂得到釋放,並獲得重生般,有股力量要爆發似的!我相當喜歡他的作品!畫面很有力量,促使著我們跟著他的線條,奔放、恣意飛翔,好像有無限可能似的!

page0_blog_entry3_1

page0_blog_entry6_1

page0_blog_entry9_1

Ghostco

Matthew Woodson 出生於美國的印地安納州,作品主題總是環繞在「人」的身上,透過畫面訴說一些想法、議題與情感,漫畫風格的線條相當容易讓人接受!網站上也有一些漫畫創作,沒有對白,僅透過幾格簡單的畫面,卻能讓人深刻感受到一股強烈的情緒,偏灰色調的風格,也總讓人看完作品之後進入沉思,值得一再玩味、讚賞。

ghostco09

ghostco22

ghostco17

ghostco20  

Mario Belem

來自葡萄牙的插畫藝術家,作品混用粉臘筆創作,讓他的插畫看起來別有一番特色!作品裡面多以衝浪、南島為主題,鮮明的色彩、有趣的畫面,商業色彩濃厚!

ess_cd01

buondi2007-01

TAM1

話說插畫家真是一個有趣的職業,感覺較為抽象、隱喻、隨性,多以豐富的色彩、圖紋、元素來構成畫面。自己很難做到這種程度,一直無法理解插畫家創作的思考過程是如何進行的,呵呵,每次想要試著創作插畫,就會感到挫折,因為很沒 Fu 啊!相當佩服這些內涵豐富的插畫創作家!他們所帶來視覺上、思考上、靈感的激勵都相當棒!

Read More...