<option id="uausy"></option>
  • <li id="uausy"></li>
  • array(23) {
      ["id"] => string(2) "96"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "1"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(1) "0"
      ["name"] => string(6) "服務"
      ["thumb"] => string(63) "/modules/cms/uploads/recommend/2018/05/15/05797102164099283.png"
      ["image"] => string(0) ""
      ["desc"] => string(0) ""
      ["pdir"] => string(0) ""
      ["dir"] => string(7) "service"
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(1)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(1)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(88) "定制開發-APP定制開發,微信定制開發,小程序定制開發,網站定制開發"
        ["meta_keywords"] => string(75) "APP定制開發,微信定制開發,小程序定制開發,網站定制開發"
        ["meta_description"] => string(0) ""
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(21) "show_page_dingzhi.tpl"
        ["formid"] => string(0) ""
        ["url"] => string(0) ""
        ["target"] => string(0) ""
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "1"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2018/05/25/05805654599261264.jpg"
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "0"
      ["scope"] => string(0) ""
      ["modelname"] => NULL
      ["son"] => array(9) {
        [0] => array(22) {
          ["id"] => string(3) "187"
          ["siteid"] => string(1) "1"
          ["type"] => string(1) "1"
          ["m_id"] => string(1) "0"
          ["p_id"] => string(2) "96"
          ["name"] => string(15) "小程序開發"
          ["thumb"] => string(0) ""
          ["image"] => string(0) ""
          ["desc"] => string(112) "專業微信小程序解決方案|各種場景核心功能,提前布局微信新生態,搶占第一波紅利"
          ["pdir"] => string(0) ""
          ["dir"] => string(6) "wechat"
          ["url"] => string(0) ""
          ["setting"] => array(15) {
            ["is_html"] => int(1)
            ["content_is_html"] => int(0)
            ["urlrule"] => int(1)
            ["contenturlrule"] => int(0)
            ["meta_title"] => string(107) "小程序_商城小程序_門店小程序_微圈小程序_餐飲小程序開發-藝源科技小程序開發"
            ["meta_keywords"] => string(103) "小程序開發,商城小程序開發,門店小程序開發,微圈小程序開發,餐飲小程序開發"
            ["meta_description"] => string(269) "專注提供專注提供小程序、商城小程序、門店小程序、微圈小程序、餐飲小程序開發,專業團隊,一對一服務,助企業快速生成自己的移動端微商城平臺. 藝源科技小程序采用高性能數據架構,系統穩定安全。"
            ["category_template"] => string(0) ""
            ["list_template"] => string(0) ""
            ["show_template"] => string(17) "show_page_xcx.tpl"
            ["formid"] => string(0) ""
            ["url"] => string(0) ""
            ["target"] => string(0) ""
            ["pri_grade_visit"] => array(0) {
            }
            ["pri_grade_add"] => array(0) {
            }
          }
          ["order"] => string(1) "0"
          ["sethtml"] => string(1) "0"
          ["stat"] => string(1) "2"
          ["flowid"] => string(1) "0"
          ["image_mo"] => string(0) ""
          ["page_num"] => string(1) "0"
          ["wxstat"] => string(1) "1"
          ["scope"] => string(0) ""
          ["modelname"] => NULL
        }
        [1] => array(22) {
          ["id"] => string(3) "199"
          ["siteid"] => string(1) "1"
          ["type"] => string(1) "1"
          ["m_id"] => string(1) "0"
          ["p_id"] => string(2) "96"
          ["name"] => string(9) "APP開發"
          ["thumb"] => string(0) ""
          ["image"] => string(0) ""
          ["desc"] => string(0) ""
          ["pdir"] => string(0) ""
          ["dir"] => string(3) "APP"
          ["url"] => string(0) ""
          ["setting"] => array(15) {
            ["is_html"] => int(1)
            ["content_is_html"] => int(0)
            ["urlrule"] => int(1)
            ["contenturlrule"] => int(0)
            ["meta_title"] => string(65) "app開發_app定制開發_app制作開發公司【藝源科技】"
            ["meta_keywords"] => string(53) "app開發,app定制開發公司,app制作開發公司"
            ["meta_description"] => string(0) ""
            ["category_template"] => string(0) ""
            ["list_template"] => string(0) ""
            ["show_template"] => string(17) "show_page_app.tpl"
            ["formid"] => string(0) ""
            ["url"] => string(0) ""
            ["target"] => string(0) ""
            ["pri_grade_visit"] => array(0) {
            }
            ["pri_grade_add"] => array(0) {
            }
          }
          ["order"] => string(1) "1"
          ["sethtml"] => string(1) "0"
          ["stat"] => string(1) "2"
          ["flowid"] => string(1) "0"
          ["image_mo"] => string(0) ""
          ["page_num"] => string(1) "0"
          ["wxstat"] => string(1) "0"
          ["scope"] => string(0) ""
          ["modelname"] => NULL
        }
        [2] => array(22) {
          ["id"] => string(3) "244"
          ["siteid"] => string(1) "1"
          ["type"] => string(1) "1"
          ["m_id"] => string(1) "0"
          ["p_id"] => string(2) "96"
          ["name"] => string(12) "快抖霸屏"
          ["thumb"] => string(0) ""
          ["image"] => string(0) ""
          ["desc"] => string(0) ""
          ["pdir"] => string(0) ""
          ["dir"] => string(7) "kuaidou"
          ["url"] => string(0) ""
          ["setting"] => array(15) {
            ["is_html"] => int(1)
            ["content_is_html"] => int(0)
            ["urlrule"] => int(1)
            ["contenturlrule"] => int(0)
            ["meta_title"] => string(71) "快抖霸屏_抖音快手霸屏_短視頻營銷獲客技術提供商!"
            ["meta_keywords"] => string(69) "快抖霸屏,抖音快手霸屏,快抖短視頻搜索,同城爆店碼"
            ["meta_description"] => string(161) "藝源智能云推廣系統13325455411專注快抖霸屏,抖音快手霸屏,同城爆店碼,一款線下與線上流量緊密結合的營銷爆客解決方案。"
            ["category_template"] => string(0) ""
            ["list_template"] => string(0) ""
            ["show_template"] => string(20) "show_page_douyin.tpl"
            ["formid"] => string(0) ""
            ["url"] => string(0) ""
            ["target"] => string(0) ""
            ["pri_grade_visit"] => array(0) {
            }
            ["pri_grade_add"] => array(0) {
            }
          }
          ["order"] => string(1) "2"
          ["sethtml"] => string(1) "0"
          ["stat"] => string(1) "2"
          ["flowid"] => string(1) "0"
          ["image_mo"] => string(0) ""
          ["page_num"] => string(1) "0"
          ["wxstat"] => string(1) "0"
          ["scope"] => string(27) "需要短視頻推廣排名"
          ["modelname"] => NULL
        }
        [3] => array(22) {
          ["id"] => string(3) "207"
          ["siteid"] => string(1) "1"
          ["type"] => string(1) "1"
          ["m_id"] => string(1) "0"
          ["p_id"] => string(2) "96"
          ["name"] => string(14) "AI智能名片"
          ["thumb"] => string(0) ""
          ["image"] => string(63) "/modules/cms/uploads/recommend/2019/07/04/06155550417466502.jpg"
          ["desc"] => string(0) ""
          ["pdir"] => string(0) ""
          ["dir"] => string(2) "ai"
          ["url"] => string(0) ""
          ["setting"] => array(15) {
            ["is_html"] => int(1)
            ["content_is_html"] => int(0)
            ["urlrule"] => int(1)
            ["contenturlrule"] => int(0)
            ["meta_title"] => string(68) "藝源AI智能名片_名片小程序_智能名片_讓銷售更簡單"
            ["meta_keywords"] => string(97) "藝源AI智能名片,名片小程序,智能名片_讓銷售更簡單,電子名片,二維碼名片"
            ["meta_description"] => string(184) "藝源AI智能名片-讓銷售更簡單。藝源AI智能名片為企業提供名片小程序,智能名片,企業名片,小程序名片,電子名片,二維碼名片等相關的服務。"
            ["category_template"] => string(0) ""
            ["list_template"] => string(0) ""
            ["show_template"] => string(16) "show_page_ai.tpl"
            ["formid"] => string(0) ""
            ["url"] => string(0) ""
            ["target"] => string(0) ""
            ["pri_grade_visit"] => array(0) {
            }
            ["pri_grade_add"] => array(0) {
            }
          }
          ["order"] => string(1) "3"
          ["sethtml"] => string(1) "0"
          ["stat"] => string(1) "2"
          ["flowid"] => string(1) "0"
          ["image_mo"] => string(0) ""
          ["page_num"] => string(1) "0"
          ["wxstat"] => string(1) "0"
          ["scope"] => string(0) ""
          ["modelname"] => NULL
        }
        [4] => array(22) {
          ["id"] => string(3) "201"
          ["siteid"] => string(1) "1"
          ["type"] => string(1) "1"
          ["m_id"] => string(1) "0"
          ["p_id"] => string(2) "96"
          ["name"] => string(12) "版權登記"
          ["thumb"] => string(0) ""
          ["image"] => string(63) "/modules/cms/uploads/recommend/2021/08/04/06814062280145708.jpg"
          ["desc"] => string(0) ""
          ["pdir"] => string(0) ""
          ["dir"] => string(9) "copyright"
          ["url"] => string(0) ""
          ["setting"] => array(15) {
            ["is_html"] => int(1)
            ["content_is_html"] => int(0)
            ["urlrule"] => int(1)
            ["contenturlrule"] => int(0)
            ["meta_title"] => string(0) ""
            ["meta_keywords"] => string(0) ""
            ["meta_description"] => string(0) ""
            ["category_template"] => string(0) ""
            ["list_template"] => string(0) ""
            ["show_template"] => string(23) "show_page_copyright.tpl"
            ["formid"] => string(0) ""
            ["url"] => string(0) ""
            ["target"] => string(0) ""
            ["pri_grade_visit"] => array(0) {
            }
            ["pri_grade_add"] => array(0) {
            }
          }
          ["order"] => string(1) "4"
          ["sethtml"] => string(1) "0"
          ["stat"] => string(1) "2"
          ["flowid"] => string(1) "0"
          ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2021/08/04/06814063838873717.jpg"
          ["page_num"] => string(1) "0"
          ["wxstat"] => string(1) "0"
          ["scope"] => string(0) ""
          ["modelname"] => NULL
        }
        [5] => array(22) {
          ["id"] => string(3) "203"
          ["siteid"] => string(1) "1"
          ["type"] => string(1) "1"
          ["m_id"] => string(1) "0"
          ["p_id"] => string(2) "96"
          ["name"] => string(12) "商標注冊"
          ["thumb"] => string(0) ""
          ["image"] => string(63) "/modules/cms/uploads/recommend/2021/08/03/06813359170749750.jpg"
          ["desc"] => string(0) ""
          ["pdir"] => string(0) ""
          ["dir"] => string(9) "trademark"
          ["url"] => string(0) ""
          ["setting"] => array(15) {
            ["is_html"] => int(1)
            ["content_is_html"] => int(0)
            ["urlrule"] => int(1)
            ["contenturlrule"] => int(0)
            ["meta_title"] => string(131) "商標注冊_商標注冊流程_商標注冊流程及費用_西安商標注冊_西安商標注冊代理-「源知果」藝源科技"
            ["meta_keywords"] => string(103) "商標注冊,商標注冊流程,商標注冊流程及費用,西安商標注冊,西安商標注冊代理"
            ["meta_description"] => string(182) "「源知果」西安提供代理版權登記,代理商標注冊,代理專利申請,代理企業貫標,代理高新技術企業認定的服務;咨詢電話:13325455411。"
            ["category_template"] => string(0) ""
            ["list_template"] => string(0) ""
            ["show_template"] => string(23) "show_page_trademark.tpl"
            ["formid"] => string(0) ""
            ["url"] => string(0) ""
            ["target"] => string(0) ""
            ["pri_grade_visit"] => array(0) {
            }
            ["pri_grade_add"] => array(0) {
            }
          }
          ["order"] => string(1) "5"
          ["sethtml"] => string(1) "0"
          ["stat"] => string(1) "2"
          ["flowid"] => string(1) "0"
          ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2019/06/11/06135617157272716.png"
          ["page_num"] => string(1) "0"
          ["wxstat"] => string(1) "0"
          ["scope"] => string(0) ""
          ["modelname"] => NULL
        }
        [6] => array(22) {
          ["id"] => string(3) "205"
          ["siteid"] => string(1) "1"
          ["type"] => string(1) "1"
          ["m_id"] => string(1) "0"
          ["p_id"] => string(2) "96"
          ["name"] => string(12) "網站建設"
          ["thumb"] => string(0) ""
          ["image"] => string(63) "/modules/cms/uploads/recommend/2019/06/21/06144566585327511.jpg"
          ["desc"] => string(149) "節約IT成本/降低運維成本/網站安全穩定/不滿意全額退款|節約IT成本/降低運維成本/網站安全穩定/不滿意全額退款"
          ["pdir"] => string(0) ""
          ["dir"] => string(7) "website"
          ["url"] => string(0) ""
          ["setting"] => array(15) {
            ["is_html"] => int(1)
            ["content_is_html"] => int(0)
            ["urlrule"] => int(1)
            ["contenturlrule"] => int(0)
            ["meta_title"] => string(80) "西安商城網站建設_政府網站建設_學校網站建設就選藝源科技"
            ["meta_keywords"] => string(113) "西安網站建設,西安網絡公司,西安網頁設計,商城網站建設,政府網站建設,學校網站建設"
            ["meta_description"] => string(248) "「藝源科技」是西安一家專業的西安商城網站建設,政府網站建設,學校網站建設的網絡公司,咨詢電話:029-88810146/150 9401 9029。公司擁有10年實踐經驗,為您提供一條龍的互聯網應用解決方案。"
            ["category_template"] => string(0) ""
            ["list_template"] => string(0) ""
            ["show_template"] => string(21) "show_page_website.tpl"
            ["formid"] => string(0) ""
            ["url"] => string(0) ""
            ["target"] => string(0) ""
            ["pri_grade_visit"] => array(0) {
            }
            ["pri_grade_add"] => array(0) {
            }
          }
          ["order"] => string(1) "6"
          ["sethtml"] => string(1) "0"
          ["stat"] => string(1) "2"
          ["flowid"] => string(1) "0"
          ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2019/06/24/06146855992801864.jpg"
          ["page_num"] => string(1) "0"
          ["wxstat"] => string(1) "0"
          ["scope"] => string(0) ""
          ["modelname"] => NULL
        }
        [7] => array(22) {
          ["id"] => string(3) "208"
          ["siteid"] => string(1) "1"
          ["type"] => string(1) "2"
          ["m_id"] => string(1) "0"
          ["p_id"] => string(2) "96"
          ["name"] => string(15) "云服務平臺"
          ["thumb"] => string(0) ""
          ["image"] => string(0) ""
          ["desc"] => string(0) ""
          ["pdir"] => string(0) ""
          ["dir"] => string(0) ""
          ["url"] => string(0) ""
          ["setting"] => array(15) {
            ["is_html"] => int(0)
            ["content_is_html"] => int(0)
            ["urlrule"] => int(0)
            ["contenturlrule"] => int(0)
            ["meta_title"] => string(0) ""
            ["meta_keywords"] => string(0) ""
            ["meta_description"] => string(0) ""
            ["category_template"] => string(0) ""
            ["list_template"] => string(0) ""
            ["show_template"] => string(0) ""
            ["formid"] => string(0) ""
            ["url"] => string(21) "http://www.qulvkj.com"
            ["target"] => string(6) "_blank"
            ["pri_grade_visit"] => array(0) {
            }
            ["pri_grade_add"] => array(0) {
            }
          }
          ["order"] => string(1) "7"
          ["sethtml"] => string(1) "0"
          ["stat"] => string(1) "2"
          ["flowid"] => string(1) "0"
          ["image_mo"] => string(0) ""
          ["page_num"] => string(1) "0"
          ["wxstat"] => string(1) "0"
          ["scope"] => string(0) ""
          ["modelname"] => NULL
        }
        [8] => array(22) {
          ["id"] => string(3) "202"
          ["siteid"] => string(1) "1"
          ["type"] => string(1) "1"
          ["m_id"] => string(1) "0"
          ["p_id"] => string(2) "96"
          ["name"] => string(9) "SEO優化"
          ["thumb"] => string(0) ""
          ["image"] => string(63) "/modules/cms/uploads/recommend/2021/08/03/06813061683398516.jpg"
          ["desc"] => string(0) ""
          ["pdir"] => string(0) ""
          ["dir"] => string(3) "seo"
          ["url"] => string(0) ""
          ["setting"] => array(15) {
            ["is_html"] => int(1)
            ["content_is_html"] => int(0)
            ["urlrule"] => int(1)
            ["contenturlrule"] => int(0)
            ["meta_title"] => string(90) "【西安SEO優化_西安網站優化_關鍵詞排名優化】-SEO優化公司藝源科技"
            ["meta_keywords"] => string(81) "西安SEO優化,西安SEO優化公司,西安網站優化,西安網站優化公司"
            ["meta_description"] => string(244) "藝源科技(yysweb.com),專注為企業提供百度等搜索引擎整站SEO優化服務,針對不同行業、網站情況給出不同策略、報價和SEO建議;是您值得信賴的seo診斷、顧問咨詢等云SEO技術服務外包商。"
            ["category_template"] => string(0) ""
            ["list_template"] => string(0) ""
            ["show_template"] => string(17) "show_page_seo.tpl"
            ["formid"] => string(0) ""
            ["url"] => string(0) ""
            ["target"] => string(0) ""
            ["pri_grade_visit"] => array(0) {
            }
            ["pri_grade_add"] => array(0) {
            }
          }
          ["order"] => string(1) "8"
          ["sethtml"] => string(1) "0"
          ["stat"] => string(1) "2"
          ["flowid"] => string(1) "0"
          ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2021/08/03/06813062712033401.jpg"
          ["page_num"] => string(1) "0"
          ["wxstat"] => string(1) "0"
          ["scope"] => string(0) ""
          ["modelname"] => NULL
        }
      }
    }
    
    				
    當前位置: 首頁 > 售后 > 藝源智庫
    超全面的 APP 動效設計必備知識總結
    時間:2019-10-09 15:58:32
    文章發布:李陽
    原創作者:未知
    來源:互聯網

    如今豐富細膩的 App 動效遍布移動端優秀應用界面中,為用戶提供了良好的動態沉浸式體驗,動效設計在產品研發過程中也越來越被認可和重視。

    通過本文,你將輕松了解到關于動效設計的一些必備知識:

    • 究竟為什么要設計動效?它的意義和價值是什么?

    • App 動效形式多種多樣,如何將它們區分和歸類?

    • 優秀的動效有哪些實用性的指導原則供我們參考?

    • 動效軟件紛繁眾多,如何挑選出最合適的那一款?(文末附有下載鏈接)


    一、動效設計的必要性

    1. 提升用戶體驗

    設計師若只追求靜態像素的完美呈現,而忽略動態過程的合理表達,會導致用戶不能在視覺上覺察元素的連續變化,進而很難對新舊狀態的更替有清晰的感知。

    迪士尼動畫大師乃特維克說過一句話:動畫的一切皆在于時間點和空間幅度。

    通過「時間點」和「空間幅度」的設計為用戶建立運動的可信度,即視覺上的真實感,當用戶意識到這個動作是合理的,才能更加清晰愉悅地使用產品。

    超全面的 APP 動效設計必備知識總結-藝源科技

    2. 增添產品氣質

    未添加動效的產品,會帶給人一種死氣沉沉的感覺,所有內容平鋪直敘、毫無生機,即使界面設計的很美觀,也會缺乏一種靈動細膩的氣質。

    如果把產品比作成美女,那么界面視覺就是美女的顏值,交互動效就是美女的肢體語言。合理的動效能將更立體、更富有關聯性的信息傳遞出去,提高產品的「表達能力」,增加親和力和趣味性,也利于品牌的建立。

    超全面的 APP 動效設計必備知識總結-藝源科技

    3. 創造設計師優勢

    • 降低溝通成本:設計師通過制作高保真動效 Demo 展示設計思路和創意,大大提高設計提案交接率,降低了設計師與開發的溝通成本,提高了動效的還原度,體現專業性。

    • 打造核心競爭力:在 UI 設計行業已經趨于飽和,并且產品設計流程逐漸實現體系化和模塊化的今天,設計師如果只會利用組件重復性地「拼湊」頁面而無更多的價值產出,被替代的可能性將會增大。在日常工作之余,若要為公司和團隊輸出更多的價值,動效設計能力便是交互/視覺設計師的必備技能與核心競爭力之一。

    超全面的 APP 動效設計必備知識總結-藝源科技


    二、動效設計的類型

    界面動效種類紛繁多樣,根據 App 動效的作用,可以大體分為如下6個類型:

    1. 轉場過渡

    人腦灰質會對動態事物(如:移動、形變、色變等)保持敏感。在界面中加入一些平滑舒適的過渡效果,不僅能讓界面顯得生動,更能幫助用戶理解界面前后變化的邏輯關系。

    超全面的 APP 動效設計必備知識總結-藝源科技

    2. 層級展示

    現實空間里,物體存在近大遠小原則,運動則會近快遠慢。當界面中的元素存在不同層級時,恰當的動效可以幫助用戶理清前后位置關系,以動效來體現整個系統的空間感。

    超全面的 APP 動效設計必備知識總結-藝源科技

    3. 空間擴展

    在移動端界面設計中,由于有限的屏幕空間難以承載大量的信息內容,可以通過折疊、翻轉、縮放等形式拓展附加內容的存儲空間,以漸進展示的方式來減輕用戶的認知負擔。

    超全面的 APP 動效設計必備知識總結-藝源科技

    4. 聚焦關注

    聚焦關注是通過元素的動作變化,提醒用戶關注特點的內容信息。這種提醒方式不僅可以降低視覺元素的干擾,使界面更清爽簡潔,還能在用戶使用過程中,輕盈自然地吸引用戶注意力。

    超全面的 APP 動效設計必備知識總結-藝源科技

    5. 內容呈現

    界面內容元素按照一定的秩序規律逐級呈現,引導用戶視覺焦點走向,幫助用戶更好地感知頁面布局、層級結構和重點內容,同時也能讓整個流程更加豐富流暢,增添了界面的活力。

    超全面的 APP 動效設計必備知識總結-藝源科技

    6. 操作反饋

    無論是點擊、長按、拖拽、滑動等交互行為,都應該得到系統的即時反饋,將其以視覺或動效的方式展現,幫助用戶了解當前系統對交互過程的響應情況,為用戶帶來安全感。

    超全面的 APP 動效設計必備知識總結-藝源科技


    三、動效設計的原則

    這是一位在五年時間內為四十多個國家和上百個頂尖機構提供咨詢服務的動效設計師,總結出來的實用性動效設計原則,為提升產品體驗與可用性提供幫助。

    1. 緩入緩出

    時效事件發生時,元素的動作應顯得自然,與用戶預期相符。

    超全面的 APP 動效設計必備知識總結-藝源科技

    2. 偏移與延遲

    加入新的界面元素或場景時,可用于表達元素之間的關系。

    超全面的 APP 動效設計必備知識總結-藝源科技

    3. 父子關系

    當界面元素較多時,可以利用時空差異創造出可以感知到的父子繼承關系。

    超全面的 APP 動效設計必備知識總結-藝源科技

    4. 形變

    用連貫的狀態描繪表達元素功能的改變。

    超全面的 APP 動效設計必備知識總結-藝源科技

    5. 值變

    當元素的值發生變化時,用連續動態的方式表達前后之間的關聯。

    超全面的 APP 動效設計必備知識總結-藝源科技

    6. 遮罩

    如果一個界面元素的不同的展示方式對應不同的功能,那么讓展示方式的變化過程具有連續性。

    超全面的 APP 動效設計必備知識總結-藝源科技

    7. 覆蓋

    用堆疊元素的相對位置來描述它們的扁平空間關系。

    超全面的 APP 動效設計必備知識總結-藝源科技

    8. 復制

    當新的元素從已有元素復制出來時,用連貫的方式描述其關聯關系。

    超全面的 APP 動效設計必備知識總結-藝源科技

    9. 景深

    允許用戶瞥得到非主要元素或場景。

    超全面的 APP 動效設計必備知識總結-藝源科技

    10. 視差

    當用戶滾動界面時,在平面創造出空間層次。

    超全面的 APP 動效設計必備知識總結-藝源科技

    11. 翻轉

    通過具有空間架構的描述方式來表現新元素的產生與離場。

    超全面的 APP 動效設計必備知識總結-藝源科技

    12. 滑動變焦

    用連續的空間描述來引導界面元素和空間。

    超全面的 APP 動效設計必備知識總結-藝源科技


    四、動效軟件的選擇

    動效設計軟件紛繁眾多,不同軟件的側重點也各不相同,設計師可以根據項目的時間、精細度、面向對象等條件來選擇合適的軟件。下面我列舉出市面上常見的動效軟件以及各自的優缺點,供選擇參考。

    1. After Effects

    AE 這款軟件知名度很高,學過設計的應該都知道,它的優點就是強大,可以實現超高精度的動效,一般 UI 動效制作只用到了 AE 很小的一部分功能。缺點是門檻高,上手較困難,不能做實時交互動效。

    超全面的 APP 動效設計必備知識總結-藝源科技

    2. Hype

    Hype 號稱無代碼動效神器,像 AE 一樣使用時間軸來設置動畫。動畫效果在 PC、Mobile、Pad 端都可以直接預覽,也可以導出視頻或者 GIF。3.0版還有物理特性和彈性曲線,可以實現更強大的動畫效果。

    超全面的 APP 動效設計必備知識總結-藝源科技

    3. Principle

    Principle 功能強大,界面和 Sketch 類似,被譽為 Sketch 的最佳拍檔。它主要是做少量頁面間的過渡轉場、單元素動畫等細節動效。優點很明顯,上手快、效率高、質感好,缺點就是不易做整套交互流程。

    超全面的 APP 動效設計必備知識總結-藝源科技

    4. Flinto

    Flinto 界面跟 Sketch 也非常相似,能夠快速實現各種滾動、轉場、點擊反饋等效果,適合模擬多個頁面、場景復雜的交互流程,學習成本低。缺點是復雜的動效難以實現,價格略貴且試用期短。

    超全面的 APP 動效設計必備知識總結-藝源科技

    5. Framer

    Framer 是一個基于 Javas cript 的原型工具,能快速導入 Photoshop、Sketch 中的圖像并模擬圖層分層,支持手勢,動畫精細度高,可在手機或平板中預覽效果。缺點是需要有一定的編程基礎,上手難度較高。

    超全面的 APP 動效設計必備知識總結-藝源科技

    6. ProtoPie

    ProtoPie 是一款交互原型設計工具,支持 Mac 和 Windows 雙平臺,更加輕量級,集成的功能更吸引人,可以調用 iPhone 系統的陀螺儀、麥克風、羅盤、3D Touch,多種智能傳感器等等,絕對是 Windows 用戶設計師的福利。

    超全面的 APP 動效設計必備知識總結-藝源科技

    小結

    • 動效設計可以提升用戶體驗、增添產品氣質,并為設計師創造優勢。

    • 6種作用的動效類型:轉場過渡、層級展示、空間擴展、聚焦關注、內容呈現、操作反饋。

    • 12個實用性的動效原則 :緩入緩出、偏移與延遲、父子關系、形變、值變、遮罩、覆蓋、復制、景深、視差、翻轉、滑動變焦。

    • 根據項目時間、精細度、面向對象等條件,選擇合適的工具制作動效。

    最后,已為大家整理好了各個軟件的官方下載鏈接,請收下。

    小程序開發
    標簽: 交互體驗 動效 動效設計 用戶體驗 經驗分享
    *版權申明:本站部分文章由藝源科技收集整理,不代表我們的觀點。如果這篇轉載侵犯您的版權,請及時聯系我們刪除!
    為您推薦
    最新文章
    掃碼加他,免費獲取方案
    久久青草费线频观看地址_少妇久久久久久久久久_亚洲欧洲自拍拍偷午夜色_国产sm重味一区二区三区
    <option id="uausy"></option>
  • <li id="uausy"></li>