追求卓越一諾千金

藍藍設計-优彩登录,2011年成立|-|15分时时彩是真的吗,主創清華團隊-22彩票平台有风险吗,專注軟件和互聯網ui設計開發_-重创燃烧军团。擅長企業信息化管理--拳皇97无限能量版、監控|-_温州口碑网、大數據軟件UIUE谘詢和設計開發服務--盈发彩票是真的假的。立足UI|_地狗互联,好好學習--进口报关单样本,天天進步--木层网!


最近超火的折疊屏手機|_晚托网,應該如何做交互設計_|_无碟机?

2019-3-25 泥人張 交互設計及用戶體驗


如果您想訂閱本博客內容-|五月色桃色激情丁香,每天自動發到您的郵箱中_||金色数值, 請點這裏

隨著折疊屏手機的發布--_金曼龙,我們看到未來手機的形態可能會朝著柔性手機方向發展-|_旋转罗盘,那麼|-芳香志,讓我們來思考一件事|四川古蔺郎酒价格表:如何在折疊屏手機上做交互設計呢_|_0165下去?

最近三星-|aupres手表、華為和柔宇各發布了一款折疊屏手機|--小学语文教学叙事,它可以把一台8英寸的平板電腦通過折疊的方式變成一台方便攜帶的6英寸手機-_0165下去。折疊屏手機屬於新的手機品種||_11086平台黑,也是我目前最看好的手機形態之一(未來手機的形態應該是柔性手機|--av苍井空百度网盘资源,現在已知有柔性電路板的存在了)___金盛家居广场。通過幾天的觀察和思考_moko美空模特路遥,我認為折疊屏手機有以下好處--敕令大将军到此:

  • 更好的閱讀體驗-|108娱乐彩票的骗局。目前各手機廠商的折疊屏展開態均大於7英寸||-新密这五个人火了,我們看視頻時擁有更好地觀看體驗_-包装设计论文,同時我們再也不用擔心看漫畫時字體太小看不清了||全保定网独立团。
  • 提升效率_|-易发彩票官网。在「展開」模式下空間變大了-__杭州sn,多窗口操作成為可能_|手动过滤机,我們可以一邊看世界杯一邊用微信和朋友一起視頻呐喊|_35平台。
  • 易用性-_www xm12333 com。在這裏我想到了 ipad 一個不錯的特性|_李白的谈爱,打開多個應用後|_众彩彩票手机app下载,並在多個應用之間進行文件管理|铅钢,例如將相冊裏的圖片拖到微信或者郵件裏|_htc手机防盗,避免了多個應用之間的來回切換|-_欧式蒙牛奶粉事件。

以上基於「展開」態的想法||-唐山铁通宽带,在折疊狀態下還有一些不錯的想法供大家思考_|-采风是什么意思。

外折疊設計

華為在MWC2019上演示了一個名叫「鏡像智拍」的功能__赢彩彩票因为有你,它可以讓被拍攝的人實時看到拍攝效果|-深圳公牛通讯,並調整麵部表情與姿勢_|西安网上订烟。用自己最了解的角度及構圖使得拍攝事半功倍-盈众彩票信誉怎么样,妹子們再也不用擔心自己的男朋友把自己拍得很醜了|2m彩票永久资料全年开。

在折疊狀態時可以把背麵當做一個附加的交互空間-_-至尊彩app网站,實現一些簡單的交互操作_-金贵洋,例如打吃雞遊戲時我們可以考慮在背麵屏幕增加一些手勢操作進行8倍鏡的縮放-_注册送38元彩票,這種背部觸控方式並不是什麼新鮮事__情况说明范文,在2011年索尼旗下的掌上型遊戲機 PSV 已經在背部增加了電容式多點觸控麵板|||金华职业教务网。

除了附加的交互空間-_东莞酒店一条龙服务,我們真的可以把它當做第二塊屏幕進行使用_|班主任德育论文题目。在平時我們可以通過兩塊屏幕同時運行兩個不同的應用程序-||永胜国际投彩,例如我們可以用主屏幕玩遊戲__掌上彩票是真实的吗,在加載遊戲時翻轉屏幕刷個微博-|234彩票网络平台提款,操作起來十分方便||_雷波溪洛渡。

折疊屏當然不隻有展開和折疊兩個狀態|_|碧美斯,還有翻折狀態|_亿发彩票靠谱不,它區別於傳統手機和平板的獨立狀態_|-致富彩票快3。最直接的效果就是它可以不需要支架就立在桌麵上_-当前热门话题,實現中遠距離的自拍--天师钟馗慧剑问情;同時它可以進行多角度拍攝--盈彩彩票钱提不出来,成為製作 VR 內容的利器|-|芷江租房网。在玩法上||拆解师加点,翻折狀態可以通過兩麵屏幕的不同內容引入多人互動的概念---李白谈爱原文,但這種應用場景比較難想象_|-淘宝卖东西。

內折疊設計

相比外折疊設計_|1996平台注册,內折疊設計玩法相對較少|-|子丹电影全集,在這裏我隻想到了任天堂NDS 的概念|上海调料市场:在翻折狀態時它就是兩塊獨立屏幕_|永盛彩票正规吗,它可以獨立顯示不同的內容-||锚杆垫板,例如上屏顯示內容_|-中国现役上将,下屏顯示操作區域|霍炽昌,打遊戲時翻折狀態明顯要比其他狀態舒服|--国安部邱进。

個人觀點|__租东西:從以上案例來看|-霍尔瓦特大街 小说,外折疊設計在交互和玩法上都比內折疊設計好|038彩票手机,未來很有可能以外折疊設計為主|-_白洁在亲戚家被陈三日。

折疊屏手機交互設計的改變

1. 響應式布局

當折疊屏從小屏模式轉變成大屏模式時不應該隻是畫麵的等比例變大_-云顶至尊娱乐游戏官网,而是要考慮響應式布局設計-|惠蒙网。

描述響應式設計最著名的一句話就是「Content is like water--_优彩彩票苹果下载安装。如果將屏幕看作容器|纳雪莱,那麼內容就像水一樣」_-_全运会时间。在以前響應式設計更多用在PC Web設計上-|-杨家将之战彭城,但現在手機也應該考慮響應式設計--168彩票官方,以下是設計時需要考慮的細節|||xong出没熊出没之年货。

它不是簡單的響應式設計|_盈彩平台提不出钱来。從上文得知--灵宝党政网,「展開」態時要考慮是平板模式還是雙屏幕模式|--注册送18彩金的时时彩,如果是平板模式_|11086移动彩票登陆,那麼內容應該在一個整體裏-|为啥人们啪啪后会感到悲伤;若是雙屏幕模式則可以考慮不同屏幕展示不同內容--亿客隆彩票网站合法吗。設計時需要根據實際需求和場景進行模式選擇_东莞酒店一条龙服务。

考慮通過 Fragment(片段)來設計_易彩票网址下载。Fragment 是 Android3.0提出的 API-|-小学家长会主题,出現的初衷是為了 UI 更靈活地適應大屏幕的平板電腦-|许海中学。以下是 Android 對 Fragment 的官方介紹-|玄魔神变:「Fragment 表示 Activity 中的行為或用戶界麵部分_-花都区教育局网站。您可以將多個 Fragment 組合在一個 Activity 中來構建多窗格 UI-_计算机表演赛,以及在多個 Activity 中重複使用某個 Fragment__赢彩计划。( Activity 可以理解為一個頁麵--105彩票官网苹果版,Android 開發中最重要的概念之一)」

參考微軟的 UWP 設計概念-_诸葛智彩软件是干嘛的。UWP 即 Windows 10中的 Universal Windows Platform(Windows 通用應用平台)|_长青贝妮。UWP 應用的理念並不是為某一個終端而設計_|读者文摘投稿,而是同一套代碼和設計可以在所有 Windows 10設備上運行_亿博网赌,包括Windows 10 Mobile / Surface / PC / Xbox / HoloLens等等__|最近好看的搞笑电影。

它的響應式設計的設計技巧包括以下6點-约彩彩票什么时候开始:

調整位置__maxdos5 8:你可以改變 UI 元素在不同屏幕上的位置|_|鲁阁初恋。比如下麵這個例子-|_赢天下国际娱乐平台:為了確保同時展示兩個元素_|_永盛彩票线路,在手機上我們必須采用縱向滾動界麵-优酷付费电影,而在平板電腦上-波特卡斯d提娜,我們可以調整框架的位置||_亿彩彩票代理赚钱吗,變為橫屏滾動界麵-_-正三棱锥的性质。如果你用網格設計這些位置我们结婚了泰民停拍,你也可以不改變內容框架-美海军连发5视频,但其他 UI 元素可以使用響應式設計|_|中乌建交连体钞。

調整尺寸|-|计提职工福利费分录:你可以通過調整空白和 UI 元素的尺寸來優化框架__晨星基金业绩排行榜,比如下麵這個例子--nds好玩的游戏,可以通過簡單的增大內容框架尺寸來提升大屏幕的閱讀體驗|-|盈彩时时彩规律。

調整順序||镁合金密度:通過調整 UI 元素的順序和方向-_新密这五个人火了,優化內容顯示效果_||众发娱乐怎么进不去了。舉個例子-__淘宝购物车参数错误,在大屏上運行時-_蝗虫多少钱一斤,可以再添加一欄-_杨幂遭人非礼,並且加入分類列表-|-南汇酒吧斗殴视频,這些都是合理的|1分快3开奖结果今天。這個例子展示了在手機上使用一欄縱向滾動_-阿拉尔租房信息,而在平板上使用兩欄橫向滾動的優化_--11086移动彩票网。

展現-_永胜国际快彩:你可以基於屏幕的真實大小||广州市花都区教育局,設備支持的功能__优优娱乐11选5好不好,特定的情況或者屏幕方向展示界麵_|防火塑料布。下圖是媒體播放器的例子__148买马开奖结果查询,小屏幕上這些按鈕通常是被刪減的__|中央教育一台直播,但在大屏幕上這些按鈕是被完全保留的_-天师钟馗慧剑问情。PC 上的媒體播放器比手機上的有更多的功能|_永胜国际买彩票。

換位_-陈桥兵变令人疑:這項技巧是為特定屏幕尺寸或屏幕方向切換特定的界麵-|-佳佳宠儿。下麵這個例子是導航菜單_林娜冰21:小屏幕上他是隱藏在漢堡菜單中縱向排列的-锈水财阀,但是在大屏幕上_||天津洗浴,更大的 Tab 是更好地選擇_|-诚实基金。

改變結構-_黔中经济区发展规划:你可以為特定的設備優化特定的結構_|盈彩彩票真的假的。下麵這個例子就是兩種不同的接合結構-_小爸爸姗姗结局。

以上6點引用了Windows 開發人員中心 《Design Basics-龙居长安:Responsive design 101 for UWP apps》

2. 場景化設計

考慮用戶翻轉折疊屏幕時的場景和動機是什麼-|窝窝团新乡,從而優化現有界麵及交互流程|_-金成真,舉幾個例子||时尚王最后结局。

以 RPG 遊戲為例-_piaoxinhui。當玩家使用小屏模式時我們可以收起所有功能界麵||_悟空传电影百度云,使遊戲的沉浸感更強_-|铲形币是哪个国家的;當玩家采用大屏模式時---易付宝app官方下载,我們可以認為玩家需要獲取更多信息-_盈彩国际输钱怎么办,這時候把聊天||-轴承大世界、裝備等相關功能界麵展示出來-色群qq。

當用戶在微信裏查看定位信息有新消息提醒時|||新七天电器直销网,手機變成大屏模式時應該同時存在地圖界麵和聊天界麵-_广珠城轨最新时刻表。

相關注意事項

Google 在2018年11月就宣布了對折疊屏的支持_|_陈兴超,包括多窗口支持--易彩票是不是忽悠人的、不重啟適配等等_河南实验中学。如果想要在折疊屏手機上設計良好的用戶體驗-_-芳龄13,必須考慮以下兩個方麵_|熟年本理想:生命周期管理以及轉場動效||_365彩票登录网址是多少。

生命周期管理

目前大部分手機應用為了有更流暢的體驗會做適量的生命周期管理||_业绩描述,例如退出頁麵時會釋放相關內存||_陈秋艳。因此設計師在設計折疊屏交互時要考慮哪些頁麵不能被銷毀-_武汉高职高专学校排名,一定要讓用戶進行展開-_-云鼎捷豹系统、折疊等操作-_朱志恒, 應用任務不中斷重啟|金橘花剧情,產品可以自動適應各種屏幕下的靜態布局規格||掌上购彩。

轉場動效

從目前 Google 公布的新版 Android係統來看-||丝诺萄,已經可以做到當折疊/展開設備的時候_玩具熊不要冬眠,頁麵|||金箍didi、內容從一個屏幕自然地切換至另一個屏幕-|宋慧乔李秉宪。設計師在設計時應該基於 Google 的技術規範考慮內容-__众盈提款提不出、組件等模塊的轉場效果|优彩app是真的吗?。

參考案例-_-舞女的纯情:

華為基於HUAWEI Mate X發布的折疊屏官方適配方案|_|北斗信号源,相關鏈接||金宝街电影院:https://www.infoq.cn/article/mPwQk57bK5fg_FTcXa2i

藍藍設計www.jwrumpff.com )是一家專注而深入的界麵設計公司_-众购彩票是真的吗,為期望卓越的國內外企業提供卓越的UI界麵設計_--静海县人才信息网、BS界麵設計 |||胸器白、 cs界麵設計 _重庆方言电视剧下载、 ipad界麵設計 _-股票套牢、 包裝設計 ||_中国电信iphone4、 圖標定製 |-|易彩易彩福地app、 用戶體驗 -_众赢国际、交互設計|-_花厂峪、 網站建設 --怎样开店、平麵設計服務||暴龙摩托。


« 設計語言 - 文字編排(行高) | 整理-|番禺新闻!點讚設計分類_-劲舞团紫光5 0。»


訂閱Rss