幫助中心 | 我的帳號 | 關於我們

Photoshop+PxCook+Cutterman網頁UI設計教程/UI設計從業必讀

  • 作者:編者:李曉斌|責編:陳曉婕
  • 出版社:電子工業
  • ISBN:9787121414329
  • 出版日期:2021/08/01
  • 裝幀:平裝
  • 頁數:222
人民幣:RMB 89.8 元      售價:
放入購物車
加入收藏夾

內容大鋼
    如今,各種通信和網路連接設備與大眾生活的聯繫日益密切,而UI是用戶與設備交互的界面,這導致人們對各種類型的UI的要求越來越高,同時促進了UI設計行業的飛速發展,本書為了滿足廣大UI設計者的需求,介紹如何設計美觀又符合要求的UI。
    本書主要依據初學者學習UI設計的普遍規律安排內容,由淺入深地講解初學者感興趣和需要掌握的基礎知識和操作技巧,全面解析各個知識點。全書結合實例詳細地講解了UI的製作步驟和軟體的應用技巧,使讀者能夠輕鬆學習並掌握。
    本書共8章,主要根據UI設計知識的難易程度,以及讀者在實際工作中的應用需求來安排章節,真正做到為讀者考慮,也讓不同程度的讀者可以更有針對性地學習內容,彌補自己的弱項,並有效提高UI設計愛好者的操作速度與效率。
    本書結構清晰、內容有針對性、實例精美實用,適合大部分UI設計愛好者與設計專業的大、中專學生閱讀。隨書附贈的配套資源包中包含了本書所有實例的教學視頻、相關素材和源文件,用於補充細節內容,方便讀者學習和參考。

作者介紹
編者:李曉斌|責編:陳曉婕

目錄
第1章  網頁UI設計初體驗
  1.1  初識網頁UI
  1.2  網頁UI的分類
  1.3  網頁UI設計的工作流程
    1.3.1  網頁產品調研
    1.3.2  網頁原型設計
    1.3.3  設計網頁UI
    1.3.4  網頁UI 標注
    1.3.5  網頁UI 切圖輸出
  1.4  深刻理解網頁UI設計原則
    1.4.1  視覺美觀
    1.4.2  主題明確
    1.4.3  內容與形式相統一
    1.4.4  整體性
    1.4.5  快速載入
    1.4.6  為用戶考慮
  1.5  網頁UI的設計風格
    1.5.1  擬物化風格
    1.5.2  扁平化風格
    1.5.3  極簡化風格
    1.5.4  3D 風格
    1.5.5  插畫風格
    1.5.6  低多邊形風格
    1.5.7  無邊框風格
    1.5.8  縱向分割風格
    1.5.9  超級頭版風格
  1.6  設計網頁UI的常用工具
    1.6.1  Axure RP 9
    1.6.2  Photoshop 和Illustrator
    1.6.3  Sketch 和Adobe XD
    1.6.4  PxCook 和Cutterman
  1.7  本章小結
第2章  合理的網頁版式與布局
  2.1  了解網頁布局
    2.1.1  網頁布局的目的
    2.1.2  網頁布局的操作流程
  2.2  網頁布局的基本方法
    2.2.1  網頁的布局設計
    2.2.2  網頁布局的原則
  2.3  網頁布局的常見類型
    2.3.1  國字型
    2.3.2  拐角型
    2.3.3  標題正文型
    2.3.4  左右框架型
    2.3.5  上下框架型
    2.3.6  封面型
    2.3.7  變化型
  2.4  根據內容位置決定網頁布局方式
    2.4.1  滿屏式網頁布局
    2.4.2  一欄式網頁布局

    實戰練習01——設計並製作白酒網頁
    2.4.3  兩欄式網頁布局
    實戰練習02——布局啤酒網站
    2.4.4  三欄式網頁布局
    2.4.5  水平和垂直居中的網頁布局
  2.5  頁面分割方向的布局方式
    2.5.1  縱向分割
    2.5.2  橫向分割
    實戰練習03——布局家居網站
    2.5.3  縱向與橫向複合型
    2.5.4  運用固定區域的設計
  2.6  網頁布局的特性
  2.7  PC端與移動端網頁布局的區別
  2.8  本章小結
第3章  奠定基礎的網頁構成元素
  3.1  網頁中的線條
    3.1.1  點、線、面的關係
    3.1.2  網頁中應用的線條風格
    3.1.3  線條在網頁UI中的作用
  3.2  網頁中的標誌
    3.2.1  網頁標誌的尺寸
    3.2.2  網頁標誌的特點
    3.2.3  網頁標誌的設計規範
    實戰練習01——設計並製作網頁標誌
    3.2.4  網頁標誌的表現形式
  3.3  網頁中的圖標和按鈕
    3.3.1  網頁圖標的概念
    3.3.2  網頁圖標的設計原則
    3.3.3  網頁圖標的應用
    實戰練習02——設計並製作簡易圖標
    3.3.4  網頁按鈕的概念
    3.3.5  網頁按鈕的功能
    3.3.6  設計出色的網頁按鈕
    實戰練習03——設計並製作簡單的網頁元素
  3.4  網頁中的導航
    3.4.1  布局網頁導航
    3.4.2  網頁導航的設計技巧
    實戰練習04——設計並製作家居網頁的主體廣告和導航
  3.5  網頁中的文字
    3.5.1  網頁中的文字設置
    3.5.2  網頁文字的設計原則
    3.5.3  網頁文字的排版規則
  3.6  網頁中的圖片
    3.6.1  網頁中的圖片設置
    3.6.2  網頁圖片的應用
  3.7  網頁中的富媒體
  3.8  本章小結
第4章  美觀的網頁配色
  4.1  配色的基礎
    4.1.1  色彩的概念

    4.1.2  色彩的三要素
    4.1.3  顏色模式
    4.1.4  十六進位顏色碼
  4.2  網頁配色的基本要素
    4.2.1  網頁的主題色
    實戰練習01——設計並製作傢具網站的登錄頁面
    4.2.2  網頁的背景色
    4.2.3  網頁的輔助色
    4.2.4  網頁的文本色
    4.2.5  網頁的強調色
  4.3  網頁元素的色彩搭配
    4.3.1  網頁標誌與廣告
    4.3.2  網頁導航
    實戰練習02——設計並製作圖片資源網頁
    4.3.3  背景色與文字
    4.3.4  鏈接文字
  4.4  根據色調進行網頁配色
  4.5  利用色彩對比進行網頁配色
    4.5.1  色彩的冷暖對比
    4.5.2  色彩的大小對比
    4.5.3  色彩的色相對比
  4.6  網頁中的配色技巧
    4.6.1  突出網頁主題
    實戰練習03——設計並製作咖啡網頁
    4.6.2  融合整體配色
  4.7  本章小結
第5章  iOS系統UI設計
  5.1  iOS系統簡介
  5.2  iOS系統的元素設計
    5.2.1  尺寸單位
    5.2.2  尺寸大小
    5.2.3  組件尺寸
    5.2.4  圖標
  5.3  iOS系統的邊距和間距設計
    5.3.1  全局邊距
    實戰練習01——設計並製作運動App的主頁
    5.3.2  卡片間距
    5.3.3  內容間距
  5.4  iOS系統的文字設計
    5.4.1  字體
    5.4.2  字型大小與字重
    實戰練習02——設計並製作旅遊App的「我的」界面
  5.5  iOS系統的圖片設計
    5.5.1  圖片的比例
    5.5.2  圖片的格式
  5.6  iOS系統的網頁布局
    5.6.1  列表式布局
    5.6.2  陳列館式布局
    5.6.3  宮格式布局
    5.6.4  卡片式布局

  5.7  iOS系統UI的設計原則
    5.7.1  親密性
    5.7.2  對齊、對比和重複
    5.7.3  直截了當
    5.7.4  提供邀請
  5.8  本章小結
第6章  Android系統UI設計
  6.1  Android系統簡介
  6.2  Android系統的元素設計
    6.2.1  設計單位
    6.2.2  界面尺寸
    6.2.3  組件尺寸
    實戰練習01——設計並製作App的登錄界面
  6.3  Android系統的文字設計
    6.3.1  字體和字重
    6.3.2  字型大小
  6.4  Android系統的圖標設計
    6.4.1  啟動圖標
    6.4.2  標籤欄/系統通知圖標
    6.4.3  上下文圖標
    6.4.4  圖標尺寸
    實戰練習02——設計並製作App界面中的上下文圖標
  6.5  Android系統UI的設計原則
    6.5.1  一步到位
    6.5.2  即時反應
    6.5.3  簡化交互
    實戰練習03——設計並製作Android系統App「我的」界面
  6.6  本章小結
第7章  適配輸出網頁UI設計
  7.1  PC端網頁的適配輸出
    7.1.1  PC 端的適配方法
    7.1.2  適配時需要注意的點
  7.2  iOS系統界面的適配輸出
    7.2.1  界面標注
    7.2.2  標注工具——PxCook
    實戰練習01——標注iOS系統App界面
    7.2.3  適配輸出
  7.3  Android系統界面的適配輸出
    7.3.1  界面標注
    7.3.2  適配輸出
      7.3.3 .9  切圖法
    7.3.4  輸出工具——Cutterman插件
    實戰練習02——輸出Android系統的App界面
  7.4  本章小結
第8章  綜合案例
  8.1  設計PC端的家居網頁
    8.1.1  家居網頁案例分析
    8.1.2  家居網頁色彩分析
    8.1.3  家居網頁製作步驟
  8.2  設計iOS系統的旅遊App界面

    8.2.1  旅遊App界面案例分析
    8.2.2  旅遊App界面色彩分析
    8.2.3  旅遊App界面製作步驟
  8.3  設計Android系統的家居App界面
    8.3.1  家居App界面案例分析
    8.3.2  家居App界面色彩分析
    8.3.3  家居App界面製作步驟
  8.4  本章小結

  • 商品搜索:
  • | 高級搜索
首頁新手上路客服中心關於我們聯絡我們Top↑
Copyrightc 1999~2008 美商天龍國際圖書股份有限公司 臺灣分公司. All rights reserved.
營業地址:臺北市中正區重慶南路一段103號1F 105號1F-2F
讀者服務部電話:02-2381-2033 02-2381-1863 時間:週一-週五 10:00-17:00
 服務信箱:bookuu@69book.com 客戶、意見信箱:cs@69book.com
ICP證:浙B2-20060032