大屏ui設計
① 設計師怎樣突破手機屏幕尺寸對UI設計的影響
造型千奇百怪的小屏手機叱吒風雲的時代已經一去不復返了。事實上，近幾年的行業趨勢表明大屏手機，或者說巨屏手機，將會在很長的時間內占據主流。而現在，也是時候總結一下過去幾年裡，面對大屏手機時，設計師的失職。
如何界定大屏手機？
其實簡單稱之為大屏也不是特別准確，它的英文名稱更為形象：Phone+Tablet=Phablet ，也就是說，它是傳統手機和平板的結合體，Phablet。
因
此，這些大屏手機實際上是超過我們手掌習慣的、可掌控的尺寸，但是又沒有達到平板的級別。更准確的說，是屏幕尺寸在5~6.9英寸的那些大屏手機。作為參
考，iPhone 4&4S 的屏幕尺寸是3.5英寸，iPhone 5&5S 為4 英寸，iPhone 6
為4.7英寸，iPhone 6P 為 5.5英寸。
所以，僅需要看看屏幕尺寸就可以快速確定手機類型。
盡管Phablet在現在看來早已不是新東西了，但是絕大多數用戶都還是從三星的Note系列開始知道它的存在，到現在滿大街都是iPhone 6P之後才真正對它上心。最早的Phable可以算在三星的Galaxy Note頭上，而這款手機早在2011年就有了。
追根溯源
在
以手機呼叫為主簡訊溝通為輔的功能機時代，絕大多數用戶幾乎不會通過手機購買內容，而現在則截然不同，用戶在手機上購買數字內容早已不是新鮮事，而且數字
內容的消費會越來越多，這和手機屏幕的增長以及交互方式的改變分不開。根據Statista
的研究分析，從現在開始手機市場會以每年4%的比例增長，而截至2018年，大屏手機的增長率則預計會高達36%，不用多想，我想你能明白這中間有多大的
想像空間。
大屏手機的交互設計
大屏手機自然是大氣炫酷，現在每天都有許多用戶拋棄之前的小屏智能機加入5英寸大屏機的陣營。但是，他們並不確定更大的屏幕能給他們帶來更優秀更舒適的用戶體驗，畢竟手掌並沒有隨之增大。因此，用戶與大屏機之間的交互方式就需要進行調整了。
手機屏幕的拇指操作熱區圖你可能接觸過，它標識出了人們握持手機，並標識出那些區域拇指易於操作，哪些地方難於觸及。
其
實，拇指操作熱圖最早是由設計師Steven Hoober於2011年的書《Designing Mobile
Interface》中使用，其中的綠色部分被他稱為「單手握持時拇指觸摸最舒適的區域」。這些區域的測量是通過1333份觀測分析總結出來的，這些分析
數據還表明，49%的用戶習慣於單手握持手機，用拇指操控屏幕，而用另外一隻手做其他的事情。同樣是基於當年的這些報告，還獲取了以下信息：
36%的用戶會雙手環抱手機，用其中一隻手的拇指操控屏幕
15%的用戶會用雙手握持手機並用兩手的拇指操控屏幕，其中90%的用戶操作時習慣屏幕豎著，而10%的用戶偏向於橫屏操作。
但
是在「3.5英寸最佳」的時代過去之後，大屏手機上的操控又是怎樣的狀況呢？用戶是否需要用力伸展拇指點擊屏幕另一邊緣的按鈕，又或者他們的握持方式有所
改變？Steven
Hoober的最新研究數據表明，「用戶單手握持的比例下降，會更多用上另外一隻手，並且會頻繁地切換雙手操作，不論是輸入還是握持。」這種狀況已經延伸
到不同尺寸的設備上，包括普通的手機、大屏手機以及平板。
看
看單手握持時候用戶拇指的操作熱區圖吧，綠色的是舒適區，橙色的部分是手指用力伸展可觸及的區域，紅色則是拇指無法觸及的區域。很明顯，拇指操控區域在這
些大屏手機上並不大，用戶也不會因此委屈自己的拇指來完成復雜的任務，「一手承擔」全部的操作。所以，這也是為什麼用戶會調整他們的握持方式，適應新的握
持力度，盡量適應新的操控和交互方式，與大屏手機輕松互動。
這樣看來，似乎能讓人松一口氣，單手考慮到目前大屏手機的尺寸和界面復雜的交互，所以用戶在絕大多數的情況下其實依然是用一隻手來承擔握持的任務（握持方式有所改變）。這樣一來，為了同時兼顧握持和交互，在大屏手機上，用戶最舒適的操作區域依然很接近之前的拇指舒適區。
可惜的是，實際狀況並非如此。
如何為大屏手機設計界面/交互/用戶體驗
作為大屏手機領域的先驅，三星Galaxy Note系列為市場和用戶作出了巨大的貢獻，但是涉及界面、交互和用戶體驗之時，它唯一的貢獻可能就是那隻手寫筆了。另外一個尷尬的現實是，絕大多數的Note用戶幾乎沒用過他們的手寫筆。
相
應的，蘋果公司看起來在大屏優化上更加上心。iPhone
6P的發布將所有的問題攤了開來，iOS的設計師為此追加了諸多「可達性」設計，比如雙擊Home鍵之後，屏幕頂部的內容會向下推至舒適區，方便用戶操
作。這裡面許多設計都是典型的妥協之後的結果，在設計上有所提升但是不夠好。而iPhone之外，還有千奇百怪的Android手機，它們基本上就是八仙
過海各顯神通了，UI和交互設計上的品質就更不好說了。
Luke
Wroblewski
還提供了另外一個解決方案：將最重要的交互點移動到屏幕底部，並根據這些按鈕/控制項/操作區域的重要性，由下往上排布。（國內手機廠商魅族在設計
Flyme的時候推出了Smartbar的解決方案，和這個思路基本一致）對於iOS而言，能沿襲這種方案來進行設計自然是不錯的，Android也是如
此，但是蘋果和谷歌只能控制系統上的設計，而具體的APP開發者和設計師還需要在這個上面進行更深入的考量。
最後的思考
大
屏手機的普及程度還在快速增長，更大的屏幕和更豐富的數字內容正在重塑我們這個時代，移動端設計正在悄無聲息地改變著一切。在大屏手機的UI、交互和用戶
體驗設計上，我們還需要了解更多的實際情況，搜集更多數據支持，並且在UI/UX的決策上有更多的考量。最近兩年所有的手機和手機系統發布會上，每個主講
人都在強調「我們在大屏機界面優化上有特別的技巧」，但是實際使用的時候，千奇百怪的操作方式依然令人感到不自然。未來，還有很長的路要走，這其中的空
間，還很大。
② 網頁和軟體UI設計用多大尺寸顯示屏比較合適、
網頁1002PX寬度最好。
軟體UI，當然是看你軟體是在什麼機器上運行拉。
③ UI設計中...手機屏幕5.84英寸，怎麼算出 寬x長 的像素，就是怎麼算出要建 畫布像素的大小多少謝謝
手機看的屏幕英村，算出長寬像暑假了畫布的大小用網路知道收索一下
④ 智能科技再升級，2021款哈弗F7這么選最合適
選擇哈弗F7的朋友是怎樣的心理狀態？哈弗口碑不錯，同價位相比合資基本是高一個級別，並且在哈弗SUV家族裡它看起來比較年輕。這是最近一個大學室友在選擇了哈弗F7之後，一次閑聊它告訴我的他的想法，相信這也應該是很多朋友選擇哈弗F7的原因。作為哈弗F系列的銷量擔當，哈弗F7在今年9月也上市了2021款的車型，新車在配置上有不小的升級，所以選哪款又成了一個問題，但很顯然我的這位室友沒有選到性價比最高的那款。
先來看看新款都有哪些調整
此次上市的2021款為年度改款車型，所以在外觀上並沒有太多的調整，扁平化的六邊形進氣格柵搭配兩側犀利的大燈，看上去比較兇悍。車身側面線條十分緊綳，車尾還有一點小溜背的造型，看上去力量感十足。而車身尺寸方面，新車長寬高分別為4620/1846/1690mm，軸距為2725mm，在同級別車型有一定的優勢。
而2.0T兩驅i動和1.5T兩驅i型，2.0T兩驅i范和1.5T兩驅i潮配置基本是一致的，只是動力上升級成了2.0T發動機，價格貴了6000元。2.0T四驅i悅相比兩驅i范貴了8000元，除了升級四驅，還有真皮方向盤、面部識別、座椅記憶、循跡倒車等功能，其實也不錯。但是這個價格已經比咱們推薦的貴了2.6萬了……
優惠力度怎麼樣？
哈弗的優惠一直都是比較穩定的，沒有太大起伏，根據汽車之家的車主價格來看，哈弗F7目前的市場優惠大多都在1萬左右。而我給大家推薦的哈弗F71.5T兩驅i炫的落地價格大概在13萬出頭，對於這個級別配置的SUV來說性價比還是相當高的，畢竟這個價格基本才到主流合資小型SUV的裸車價而已。
寫在最後：
整體來說作為年度改款，新款哈弗F7的配置提升還是很明顯的，特別是全系標配的12.3英寸中控大屏，是同級別大部分的車型都沒有辦法做到的。而我給大家推薦的車型也只是一個建議，如果預算在15萬以內落地的朋友，我給大家推薦的這個配置還是相當不錯的，預算充足自然可以選擇配置更高的車型。
?
本文來源於汽車之家車家號作者，不代表汽車之家的觀點立場。
⑤ PC端UI設計尺寸規范
對於剛入行的UI設計師，最容易犯的錯就是在設計移動APP時，不懂什麼尺寸或者用哪種屏幕的尺寸是最適當的？為了解決這個問題，今天我們就簡單的為大家整理做UI時最基礎的尺寸規范。
現象
首先說現象，大家都知道移動端設備屏幕尺寸非常多，碎片化嚴重。尤其是Android，你會聽到很多種解析度：480×800, 480×854, 540×960, 720×1280, 1080×1920，而且還有傳說中的2K屏。近年來iPhone的碎片化也加劇了：640×960, 640×1136, 750×1334, 1242×2208。
不要被這些尺寸嚇倒。實際上大部分的appUI設計和移動端網頁，在各種尺寸的屏幕上都能正常顯示。說明尺寸的問題一定有解決方法，而且有規律可循。
像素密度
就目前市場狀況而言，各種手機的解析度可以這樣粗略判斷。雖然不全面，但至少在1年內都還有一定的參考意義：
ldpi 如今已絕跡，不用考慮
mdpi [320x480]（市場份額不足5%，新手機不會有這種倍率，屏幕通常都特別小）
hdpi [480x800、480x854、540x960]（早年的低端機，屏幕在3.5英寸檔位；如今的低端機，屏幕在4.7-5.0英寸檔位）
xhdpi [720x1280]（早年的中端機，屏幕在4.7-5.0英寸檔位；如今的中低端機，屏幕在5.0-5.5英寸檔位）
xxhdpi [1080x1920]（早年的高端機，如今的中高端機，屏幕通常都在5.0英寸以上）
xxxhdpi [1440x2560]（極少數2K屏手機，比如Google Nexus 6）
自然地，以1倍的mdpi作為基準。像素密度更高或者更低的設備，只需乘以相應的倍率，就能得到與基準倍率近似的顯示效果。
不過需要注意的是，Android設備的邏輯像素尺寸並不統一。比如兩種常見的屏幕480×800和1080×1920，它們分別屬於hdpi和xxhdpi。除以各自倍率1.5倍和3倍，得到邏輯像素為320×533和360×640。很顯然，後者更寬更高，能顯示更多內容。所以，即使有倍率的存在，各種Android設備的顯示效果仍然無法做到完全一致。
單位
不難發現，真正決定顯示效果的，是邏輯像素尺寸。為此，iOS和Android平台都定義了各自的邏輯像素單位。iOS的尺寸單位為pt，Android的尺寸單位為dp。說實話，兩者其實是一回事。
單位之間的換算關系隨倍率變化：
1倍：1pt=1dp=1px（mdpi、iPhone 3gs）
1.5倍：1pt=1dp=1.5px（hdpi）
2倍：1pt=1dp=2px（xhdpi、iPhone 4s/5/6）
3倍：1pt=1dp=3px（xxhdpi、iPhone 6）
4倍：1pt=1dp=4px（xxxhdpi）
單位決定了我們的思考方式。在設計和開發過程中，應該盡量使用邏輯像素尺寸來思考界面。設計Android應用時，有的設計師喜歡把畫布設為1080×1920，有的喜歡設成720×1280。給出的界面元素尺寸就不統一了。Android的最小點擊區域尺寸是48x48dp，這就意味著在xhdpi的設備上，按鈕尺寸至少是96x96px。而在xxhdpi設備上，則是144x144px。
無論畫布設成多大，我們設計的是基準倍率的界面樣式，而且開發人員需要的單位都是邏輯像素。所以為了保證准確高效的溝通，雙方都需要以邏輯像素尺寸來描述和理解界面，無論是在標注圖還是在日常溝通中。不要再說「底部標簽欄的高度是96像素，我是按照xhdpi做的」這樣的話了。
Web怎麼辦
移動端頁面的絕對單位仍然是px，至少代碼里這么寫，但它的道理也和app一樣。由於像素密度是設備本身的固有屬性，它會影響到設備中的所有應用，包括瀏覽器。前端技術可以善加利用設備的像素密度，只需一行代碼，瀏覽器便會使用app的顯示方式來渲染頁面。根據像素密度，按相應倍率縮放。
以iPhone 5s為例，屏幕的解析度是640×1136，倍率是2。瀏覽器會認為屏幕的解析度是320×568，仍然是基準倍率的尺寸。所以在製作頁面時，只需要按照基準倍率來就行了。無論什麼樣的屏幕，倍率是多少，都按邏輯像素尺寸來設計和開發頁面。只不過在准備資源圖的時候，需要准備2倍大小的圖，通過代碼把它縮成1倍大小顯示，才能保證清晰。
實際應用
大家最關心的還是實際運用，畫布該怎麼設置。我們就iOS、Android、Web三個平台來分別梳理一下。不過在這之前，我要為使用PS進行設計的朋友介紹一個小技巧。
之前我說過，我們要以邏輯像素尺寸來思考界面。體現到設計過程中，就是要把單位設置成邏輯像素。打開PS的首選項——單位與標尺界面，把尺寸和文字單位都改成點（Point）。這里的點也就是pt，無論設計iOS、Android還是Web應用，單位都用它。當然，各平台單位名稱還是要記住的。這里我們用的只是它的原理，不用在意名稱。
要調節倍率，則通過圖像大小里的DPI來控制。這個DPI，其實就是PPI，像素密度。有個常識大家都知道，屏幕上的設計DPI設成72，印刷品設計DPI設成300。為什麼是這兩個數字？
首先說300，這和人眼的分辨能力有關。由於1英寸是固定長度，每1英寸有多少個像素點決定了畫質清晰程度。之前說過，這就是像素密度，也就是DPI。DPI達到300以上，其細膩程度就會給人真實感，像真實世界中的物件。相反，DPI只有10的話，在你一個食指指節大小的長度內只有10個像素，這明顯就是馬賽克了。所以印刷品要設成300，才能保證清晰。
再說72，這有一定的歷史原因。最早的圖形設計是在mac電腦上進行的，mac本身的顯示器解析度就是72。PS中把圖像DPI也設成72，就能保證屏幕上顯示的尺寸和列印尺寸相同，便於設計。72的PC顯示器解析度逐漸成為一種默認的行業標准，這套規則就這么沿用下來。
現在回到正題，我們怎麼通過DPI來調節倍率？既然屏幕本身的解析度是72，DPI設成72剛好是1倍尺寸，那設成72的兩倍就是倍率為2的屏幕了，就這么簡單。
下面來看看3個平台各自的畫布設置：
IPhone
iPhone的屏幕尺寸各不相同，我說的是邏輯像素尺寸，這確實是讓人很頭疼的事情。如果想用一套設計涵蓋所有iPhone，就要選擇邏輯像素折中的機型。
從市場佔有率數據來看，目前最多的是iPhone5/5s的屏幕。倍率為2，邏輯像素320×568。上升勢頭最猛，未來有望登上第一的是iPhone 6的屏幕。倍率為2，邏輯像素375×667。
按照這兩種尺寸來設計，都是比較主流的做法。可以兼顧短一些的iPhone 4s，大一點的6 plus也不會過於空曠。
不過在切圖的時候要注意，由於iPhone 6 plus的3倍圖是由2倍圖放大而來，所以點陣圖要注意保證清晰。
Android
都說Android碎片化嚴重，但它現在反而比iOS好處理。因為如今的Android屏幕邏輯像素已經趨於統一了：360×640，就看你設成幾倍了。想以xhdpi為准，就把DPI設成72×2=144。想以xxhdpi為准，就把DPI設成72×3=216。
對於那些比較老的低端機，寬度是480px的那批，畫面確實會小一些，顯示內容會更少。稍微留意一下，重要內容盡量保持在界面中上部分。
當然，這些機型不出一年就會被邊緣化，基本淘汰。現在能運轉的也是當作功能機在用，軟體多了必卡無疑，用戶體驗無從談起。不作考慮也是OK的。
Web
手機端網頁就沒有統一標准了，比較流行的做法是按照iPhone 5的尺寸來設計。倍率2，邏輯像素320×568。
這樣的做法比較實在，倍率2的屏幕無論在iOS還是Android方面都是主流，而且又是2倍屏幕中邏輯像素最小的。所以圖片的尺寸可以保持在較小的水平，頁面載入速度快。當然，缺點就是在倍率3的設備上看，圖片不是特別清晰。
如果追求圖片質量，願意犧牲載入速度，那麼可以按照最大的屏幕來設計。也就是iPhone 6 plus的尺寸，倍率3，邏輯像素414×736。
總結
移動端的尺寸比PC端復雜，關鍵就在倍率。但也正因為倍率的存在，把大大小小的屏幕拉回到同一水平線，得以保證一套設計適應各種屏幕。站在這條水平線的角度看，會發現它很好理解。
⑥ android 安卓UI設計問題，對於不同的屏幕大小會出現錯位現象，我用的是linerlayout+margin_*
模擬器上有不同的解析度配置 ，QVGA、WQVGA 等等 ，應該根據實際機器的解析度配置模擬器上面的參數，在AVD裡面配置不同的解析度參數 。這樣下載到手機裡面，控制項就不會錯位了 。
⑦ android Ui設計 10寸的屏幕，1024X720 一般主菜單欄的圖標要設計多大的，距離邊界應該幾個px求大神
程序一般用的是DP
哦。。圖標啊。。你可以去一些設計網站找一套圖照著大小做。。
⑧ 數字電視的UI設計，規格是多少電視機屏幕是16：9的大小，Photoshop新建文檔的時候應設置多大
這個問題的唯一辦法，沒辦法，大多數的電視信號源是4:3（寬銀幕電影的16:9，讓你看電專影時，不會出屬現這個問題），液晶電視這樣的「前衛「是16:9。所以幾年，數字電視信號完全普及數字電視信號源將成為16:9，那麼你就不必切換。
辦法解決這個問題很簡單，不要使用全屏幕16:9的電視模式，調整到一個文本框，用遙控器模式（一個不同的名稱，不同的電視），也就是，上，下切，總的情況是不平坦的，寬屏幕（請參閱電視機的用戶手冊詳細信息）。
少4:3模式的話，額外的電視上的兩條黑杠雙方將燃燒LCD燈，因為它總是在同一個屏幕上的顏色很長一段時間。
⑨ 為什麼UI設計規范很重要
以下三點原因：
保證平台統一性
統一性是交互設計的一個基本原則，在一個長期迭版代多人合作的項權目中，不同的設計師會負責不同的模塊，每個人都有各自的思路，就有可能會對相同的元素做出了不同的方案，對於用戶來說容易造成困惑，對品牌整體形象的建設也沒有好處。所以對於較大型的產品，最好有設計規范來定義基本的元素，幫助眾多設計師一起做出有統一性的產品。
2.提升團隊工作效率
對於同一個基本元素，如果沒有設計規范，交互設計師需要設計一次交互方式，視覺設計師需要設計一次外形，UI開發同學需要開發一次，每個不同的設計師遇到這個元素時都可能重新設計一遍。但如果有了設計規范，只需設計一次，團隊中任何一個設計師需要用的時候直接拿來用就可以了，也不需要再進行視覺和開發，極大的提升了效率。
3.打磨細節體驗
在整理每個元素的規范時，設計師都需要對其場景、狀態考慮清楚。在整理的過程中，經常會發現一些以前沒注意到的問題，並進行優化。把一個小元素單獨拎出來仔細考量，寫成一篇完整規范的過程，其實就是在打磨細節的過程。
⑩ UI設計為什麼大多採用深色系背景
這個沒有絕對，一般情況下都是深淺搭配居多。
同樣的設計上色彩會根據定位風格來內做選擇，例如可愛系容用粉藍、科技炫酷用黑黃、穩重嚴謹藍調為主等。
另外在搭配上還有一種，內容區分要有對比差，這個差可以體現在明度上也可以體現在飽和上。
加油！