萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> pc與移動設計

pc與移動設計

 pc與移動設計 三聯

  隨著各大互聯網公司都轉戰移動市場,移動端產品的需求越來越大,設計師在PC與移動設計之間的相互轉移也越來越頻繁。當前許多產品的規劃都是在PC 端和移動端全方位地進行布局,這也進一步要求設計師應該有更高的素養,能在PC與移動端進行一體化的設計思考。

  然而,設備、產品形態的多樣性雖然給了設計師更多的發揮空間,同時也給他們帶來了更大地挑戰。PC與移動產品有各自的使用情景,它們的設計有何不同,如何統一思考和規劃在不同平台上產品的功能、設計是非常值得探討的話題。

  一、pc與移動設計上的差異性

  首先,我們來分析一下PC與移動在設計上的差異點。PC與移動有各自的特點,這些設備特點、系統平台、交互方式、使用情境等的不同,也極大的影響了設計上得差異。

  1. PC與移動的使用情境不一致

  PC用戶的使用情景都是以坐在電腦前為主,用戶與所處環境的互動較小,主要依靠用戶操作過程中的情境上下文來進行設計。在移動應用的情景則非常復雜,包括情景特征、用戶的姿態、網絡特征、使用時間等等,這都對設計產生了較大的影響。

  移動應用設計中,除了上下文情境外,還需要從用戶使用App的物理情境、時間情境及社會情境三個方面來分析,提供更個性化及人性化的服務。

  2. PC與移動的物理和交互特征不一致

  PC和移動端在物理和交互特性上有很大的不同。PC的顯示屏幕也越來越大,可一次呈現足夠數量的信息,可以很方便地進行多窗口操作;手機屏幕也變得越來越大,但總得來說展示的信息有限,一屏只能處理一件事情。

  在移動端有許多有趣的傳感器技術來增強手機的能力,並能成為設計師的利器,而這在PC端還比較少見。

  在PC的條件下,用戶可以使用鍵盤舒服的輸入信息,用鼠標來精確的指向被操作的對象,鼠標的直接操作配合鍵盤的快捷方式,已經形成了一個固定的整合交互模式;在移動端是基於手勢為基礎的設計,手勢的輸入更自然,但是精度不高,在小屏幕中,通過手勢進行編輯等操作存在較大的難度。

  另外,手機的電池情況、手機的流量和網絡狀態至今都還是比較大的限制,而在PC端都不存在相應的問題。

  3. PC與移動應用框架設計不同

  信息架構是PC與移動端在設計時需要考慮的首要問題,信息架構的深度與廣度的權衡,在PC端的思考方式也與手機端並不一致。手機的設計受屏幕大小的限制,在手機上呈現的信息有限,更要以內容為先,導航信息的呈現空間不能過大。而在PC端的設計一般都會將導航結構清晰展示,讓用戶能快速地了解站點的內容分布,只是把用戶關注的內容在屏幕中做突顯展示,使用戶注意力能更專注於內容。

  4. 移動端的適配比PC端要重要得多

  在Web設計中,最近這兩年才有設計師提出響應式設計的概念來適配多個屏幕的設計,而它的目的是想要通過一套設計來涵蓋手機、平板與PC的屏幕,提供一套統一的體驗。而這與手機應用的適配還存在著較大的不同,手機應用的適配只是根據手機多樣化的屏幕,對手機的屏幕寬度與高度進行滿屏適配的方案,適配會對應用中的圖片、文字排列、內容數量等進行適配。

  5. 移動端運用更多的優雅動效

  在幾乎每個移動應用上,都能看到動效的身影。動效能引導用戶該如何操作,提示內容的邏輯層次關系,讓用戶能更好地理解應用並能知道它的狀態,引誘用戶的點擊,並能傳達品牌特征讓用戶更好地記住它。而在Web端發展的某個階段上也有很多動效地使用,只是動效過渡地使用干擾了用戶的正常注意,大大降低了網站的可用性,導致現在網站反而很少使用動效。現在隨著H5技術的成熟及越來越多浏覽器性能的提升,在Web端的動效也會漸漸地流行起來。

  許多業務都有PC產品,又做移動產品,但是由於各種原因,PC產品與移動產品的規劃並不都是一起開始的,那在這種狀況下,當前市面上的都是怎麼來進行產品設計的呢?

  二、pc產品在先的一體化設計思路

  許多主流的業務都是從PC端發展起來的,然後由於智能手機的普及而自然而然地在移動端發力,這些產品的根基在PC側,然後向移動端遷移。這類業務的特點是在PC端已經發展地很完善,積累了大量的用戶,在PC業務相對成熟的情況下再來發展移動端的產品。

  現在的普遍做法是把PC的核心功能遷移到移動端,其主要工作是已有功能的移動化設計。由於PC產品已經是一個龐大的體系,要把PC產品都移動化是一個非常艱巨的任務。因此,在移動端開發這類應用往往比較痛苦,PC的成功因素籠罩著整個移動端的發展方向,使移動端的產品也很難達到超期望的目標。

  另外,移動業務在快速發展的同時,PC業務並沒有閒著,PC的新功能也在持續地迭代。這會造成手機業務會持續地去追PC的新功能,並爭取做到兩者的同步,許多這類業務的移動業務團隊現在就有點陷入到這樣的怪圈。

  然而PC與移動產品的不同,不只是形式和屏幕大小的不同:用戶在移動端的使用習慣,移動端的生態環境,產品使用情境等都很不相同。那這類產品在移動端產品設計時,要遵循一些關鍵原則為:

  1,在產品規劃階段要有獨立的、基於移動的視角來架構業務;

  2,支持PC的核心業務,但要發揮移動的特色和特點;在移動情境下,發展PC的功能,作為PC的補充及擴展;在移動情境下,發揮移動端便捷、隨時隨地、多通道感受的特點,發展新功能更新PC已有的功能;

  3,不求與PC一樣復雜的功能,但要有自己的特色與目標;不盲目的追PC的功能;

  4,新功能的設計,爭取移動優先的原則,做統一的產品設計;

  5,基本架構以Native為主,運營內容以WAP的形式整合,提升靈活性;

  6,運營的內容可以各自獨立,但是“我的”內容要能同步。PC的內容更追求高質量、多樣化的內容來吸引用戶,移動的內容要更情境化,基於用戶情境提供個性化內容。

  三、移動優先的一體化設計思路

  當前移動互聯網用戶已經超過PC,移動端的用戶覆蓋面更廣;用戶在移動端的浏覽的頻次及使用時長的增量都超過了PC,也都促使我們的新業務將更多地從移動優先的角度來思考。

  從 PC 端到移動端的整體設計,響應式設計是提得最多的方法,這看起來也是一個很好的解決方案。然而我們看到的響應式做得好的網站往往是結構相對簡單的博客類、新聞類網站,這些頁面結構簡單,響應規則容易定制,前端實現也不復雜。而對於復雜的網頁的響應式設計,則都會遇到不少挑戰。但是總的來說,由於現在的H5和移動浏覽器性能在使用上和原生應用還存在著一定的差異,較難發揮出移動的核心優勢,因此,現在純響應式的設計方案少有在PC和移動一體化項目中實踐。

  在移動優先的設計原則下,一般都是把PC端的內容作為整個業務的補充,放在次要的地位。

  那在設計中該如何來考慮PC與移動的一體化設計呢?

  1,所有的功能及需求從移動端出發來設計。把滿足用戶核心需求的功能的突顯出來。

  2,盡量做到在手機中能完成所有的任務。讓沒有PC或者不用PC的用戶能滿足需求,完成絕大多數任務。

  3.在手機與PC之間能快速地切換及銜接任務。當用戶在使用手機或者PC時,能快速地切換到另一個設備上,並能無縫銜接為完成的任務。

  4.在產品中,PC與手機要發揮各自的特色,便利用戶的操作和使用。例如,能讓用戶在PC上進行集中的編輯操作,而讓用戶能在移動端基於情境提供個性化的服務。

  5.PC上的功能要有自己的亮點及便捷性。PC在設計上要有新意,不拖累產品的整體體驗,且能說明其功能和作用的必要性,在使用上能便捷,體驗簡單。

  6.手機與PC在品牌識別性上有傳承和一致性。兩者在品牌上有傳承,讓用戶能感知其一致性。

  移動的產品與PC有很大的不同,移動情境的靈活性、移動設備的能力與限制、移動網絡及生態、移動的系統及APP形態等等都有自己的特點,從移動的角度來思考產品,才能充分基於情境去發揮移動產品的優勢,突破其固有的限制。最後,隨著穿戴式設備的普及,一體化設計的思考會越來越多。穿戴傳感器來采集數據;移動端移動端的應用作為監控、信息浏覽、基本設置等功能性入口;雲端存儲數據,提供復雜的管理界面。這都需要我們能有更系統化的來設計產品,形成一體化的統一體驗。

copyright © 萬盛學電腦網 all rights reserved