2006年12月18日 星期一

設計與品牌 II



這裡我們就用Yahoo!網頁的實例來看看,哪些視覺元素的統整,能表現一個品牌的感觀形象



  1. 視覺規格:
    跟品牌規範相關的
    代表品牌的色盤,有核心色彩與搭配應用色
    建基於良好設計傳統的規格跟標準
    減少重覆創造的循環
  2. 系統化:
    品牌元素在網頁使用上的延伸
    盡可能有系統地發展
    有彈性是很重要的
    能夠應用到產品的各個地方是很重要的


  • 色盤(color palette)


 



  • 網格系統(Grid Kit):組成頁面模組的基礎架構



 



  • 跨網頁的整套圖示(Network Suite of Icons):一致的造型,但可因服務需求改變色彩與質感的圖示,讓使用經驗一致,但又符合頁面樣式


 



  • 模組標籤(Module Tabs):Pointer tabs的樣式



實際的案例



  • Yahoo!Tech
    Yahoo! color palette
    Yahoo! tabs
    Yahoo! rounded corners
    Font sizes
    Ratings
    Header
    Underlying page grid



 



  • Yahoo!Photo 3.0
    Yahoo! color palette
    Yahoo! rounded corners
    Font sizes
    Header
    Underlying page grid





  • Yahoo!Podcasting
    Yahoo! color palette
    Yahoo! tabs
    Yahoo! rounded corners
    Font sizes
    Ratings
    Header
    Network Suite of Icons




  • Yahoo!Health
    Yahoo! color palette
    Module tabs pattern
    Yahoo! rounded/square corners
    Font sizes
    Header
    Underlying page grid




 



  • Yahoo!Mobile
  • Yahoo! color palette
    Yahoo! tabs
    Yahoo! rounded corners
    Font sizes
    call to action buttons(get it!)
    Header






1 則留言:

  1. <p>&nbsp;我是阿卿(妹妹的學妹)</p>
    <p>費盡一番心力,終於啟動了我的blog.....好幾次看了你的文章想給你留言,可都進不來。</p>
    <p>初時有不斷被耍的感覺,因為老是會收到yahoo寄來的blog可開啟並使用的通知,後來才知認證未完成。</p>
    <p>而最後再試的結果是&quot;認證過期&quot;.....<img src="http://tw.yimg.com/i/tw/blog/smiley/11.gif"/>&nbsp;天哪!難道進入blog 有這麼難嗎?</p>
    <p>才笑 妹妹 是山頂洞人,沒想到自己也不過是個探出頭的山頂洞人<img src="http://tw.yimg.com/i/tw/blog/smiley/9.gif"/></p>
    <p>在最最後做了最終的嚐試,終於yahoo給了最立即的回應,就在我要放棄之前,這種效率真驚人;</p>
    <p>原以為要等個兩天才能開始使用,沒想到馬上登入即可,呼~~~ 我真是被感動了吶 !<img src="http://tw.yimg.com/i/tw/blog/smiley/7.gif"/></p>
    [版主回覆12/20/2006 10:27:18]<p>Ha ha~恭喜妳啊!</p>
    <p>不過據說現在只要有Yahoo!的帳號登入就可以留言了,不用一定要申請blog...</p>
    <p>不過有了blog,可以試著好好經營一下,還不錯的累積喔,像做功課一樣<img src="http://tw.yimg.com/i/tw/blog/smiley/4.gif"/></p>

    回覆刪除