移动端UI设计文章及欣赏

当设计遇上AI—百度APP个人中心AI重构

ui设计分享达人

前言
 
AI能力的迅猛发展,为产品设计带来了很多新的可能性和机会。百度作为AI领域的行业先锋,正在不断探索如何将AI技术深度融入到产品中,以赋能改进和提升产品的使用体验。
 
本文将以百度APP个人中心AI重构项目为例,讲述如何运用AI智能推荐和对话能力来解决问题重构体验,将一个传统的固定入口型的个人中心打造成为一个高效智能的AI版个人中心。
 
希望能为读者提供新的视角和思路,激发大家对于AI原生设计的理解和思考。
 
 
个人中心旧版
 
作为百度APP端内业务和基础功能设置的重要回访阵地,个人中心面临着三大核心问题:①功能入口多页面屏效低;②部分功能操作层级深;③资产更新提醒不直观。
 
针对这些问题,我们希望通过精简功能结构、破壳高频功能、强化信息提示,提升用户触达效率,优化整体使用体验。为此,我们计划运用AI能力进行设计重构来解决上述三大问题。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
 
个人中心AI重构设计
 
目前行业内并没有一款运用AI能力对个人中心进行重构的产品,因此,设计师的挑战在于如何从0-1创新重构出“AI个人中心”新形态,来全面提升用户在端内的回访体验。我们依次从「框架、结构、内容、操作、对话」五部分出发定义,逐步搭建功能、丰满细节、拓展深度,创新重构出一个全新的AI版个人中心。
 
1.容器创新设计 打造AI感资产框架
 
基于上述问题和设计目标,首先对个人中心框架进行了重构设计,结合用户行为数据保留常用高频功能入口,去除原来众多类型的内容推荐卡,在页面内实现功能精简提效;其次结合AI智能推荐的能力,开辟出一个承载推荐内容的容器区域,破壳内容便于用户回访。
 
我们共计验证推敲出3种页面框架“嵌入式框架”“分层式框架”“卡片式框架”,选择与AI融合感更强、体验更沉浸的嵌入式框架继续深入,框架头部精简信息,中部保留高频功能便于用户回访,下方区域则通过AI智能推送用户所需内容。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
2.结合用户行为 主动智能推荐
 
在框架下方承载推荐内容的容器区域内,个人中心可以结合用户在百度APP的使用行为数据,通过AI向用户智能推荐内容资源和功能操作。
 
当用户的内容资产有变更时,个人中心能够主动破壳内容,如用户最近下载了一部剧集但未看完,当该剧有更新时,主动提示用户继续观看。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
当用户有设置类潜在需求时,个人中心能够推荐操作功能,如用户的手机经过一段时间使用,有系统垃圾冗余时,会主动推荐用户清理缓存。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
3.构建全业务卡片的内容结构
 
我们将各业务需要展示的信息摘取出来,采用卡片形态进行聚合与承接,以保证AI智能推荐时的灵活性和可拓展性。卡片会采用对话式引导语拉近用户距离,破壳提示内容资源,如向用户主动推荐最近收藏的内容,支持跳转查看并在返回时更新状态;还会在资产变更时进行提醒,如当用户下载视频或备份文件后,对用户实时提醒并提供复访入口;支持用户直接设置功能,支持一键点击并实时反馈状态。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
设计期间,我们从卡片分类方式、模板呈现、交互操作等维度进行了多方案探索,前后迭代实验了3款卡片形态,结合用户访谈测试和实验数据反馈,最终选择使用3.0版本的分卡聚合样式。这一版本采用了统一化模版来精简布局,通过一步操作来前置功能减步长,对功能和内容进行分类聚合来提高页面屏效、使用户更易理解。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
共计为20+业务搭建了10类聚合卡片,定义归纳了3类卡片操作与更新方式,在个人中心选用最符合用户行为的卡片和内容进行智能推荐。目前我们更多业务正在接入推荐卡片体系中,大家敬请期待~
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
4.内容破壳提示 功能操作提效
 
回归用户实际使用场景来看,AI智能推荐卡片形式在用户操作上有了很大的提效。例如查看下载视频的步长由4步缩减为1步,原来用户想继续看视频时,可能会找不到、且寻找入口比较深,现在我们通过推荐卡片破壳了视频等内容,点击卡片即可一键直达视频页,一段时间后返回个人中心时卡片会更新用户的最新观看进度。既减少了用户操作步长,又沉浸式延续了用户在端内的使用行为。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
同样,功能类的操作效率也大幅提升,之前当用户想清理时 ,入口深步骤多、体验非最佳,现在通过推荐卡片将清理缓存功能前置推出在个人中心,用户想清理缓存时,无需翻越层层入口,只需点击“清理”按钮即可一键完成缓存清理,实时告知用户清理进度,大幅提升用户操作效率。除此以外,像深色模式、字体大小等功能也都支持用户在个人中心一键操作。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
5.拓展对话场景 触达用户长尾需求 
 
个人中心不仅可以结合用户行为智能推荐卡片,还支持用户主动发起提问,通过对话形式快捷触达长尾需求。用户点击卡片下方的“去提问”入口或上滑页面,即可从个人中心进入对话页。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
进入对话页后,个人中心AI助手首先会推荐一些快捷指令,让用户快速了解对话提问方式和目前支持提问的功能。当用户发起提问后推出相关功能卡片,如在手机运行卡顿时询问“如何清理缓存”,AI助手会推出“清理缓存”卡片并引导用户前往清理,清理完成会再次回到对话页、为用户展示最新缓存状态。
 
以下是支持对话的部分功能卡片,这些卡片整体延续了推荐区域卡片的内容和体验,结合对话交互流程对卡片模版进行了差异化定制。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
最终基于业务功能特点,结合对话交互规范,共计定义了“跳转操作并返回更新”“跳转查看”“当前操作”“当前操作并追加对话”4种交互操作和更新方式。目前我们接入的场景能力尚有限,后续我们将持续进行迭代与优化,提升用户在个人中心进行AI对话的体验。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
 
AI个人中心实验上线效果
 
AI版本实验上线后,百度APP和个人中心的关键数据都有了显著提升,带来了正向收益,我们也于今年6月底上线全端,期待大家体验并给予反馈。
 
 
思考与展望
 
如今产品AI化已成为市场发展趋势,作为设计师,如何结合自己的业务,运用AI能力重构产品及体验是一个极具挑战和价值的课题。我们从百度APP个人中心AI重构项目中总结出了一些经验和小tips,在此向大家分享:
 
  •  
    在应用AI技术之前,首要任务是明确其能力范围与显著优势,如文中使用的AI智能推荐能力能够同时满足用户的个性化需求、提升信息获取效率,从而全方位提升用户体验和业务价值。
 
  •  
    我们需要大胆突破、勇于创新,在没有可参考借鉴的产品时应当打破惯性思维,尝试从框架、结构、内容等层面进行全新定义,然后通过持续打磨、深度探索等手段来不断完善产品形态。
 
  •  
    无论是否应用AI,设计底层思维是万变不离其宗的,我们需要始终站在用户视角分析并解决问题,而AI将会是每位设计师的一个趁手工具和灵感中心,它可以给我们更多思考问题的角度,日常工作中我们应当多积累总结然后不断迸发新思考,通过AI这个新工具来解决我们业务的已有问题,向用户提供更好的体验。
 
以上是我们的一些小小心得,希望能为同为设计师的你,在面对AI应用与重构设计时提供一些设计思路和借鉴。
后续,我们将持续聚焦提升个人中心的AI智能感知能力,围绕用户的偏好习惯及当前上下文环境,提供更精准的个性化服务,为用户升级更加智能、自然流畅的AI对话体验,通过结合更多场景逐步打造出一个全方位、个性化的百度APP AI助手,让每位用户都能享受到智能化的便捷与乐趣。
 
 


作者:百度MEUX
链接:https://www.zcool.com.cn/article/ZMTYzMzE4MA==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

 

 

冬奥智能气象APP设计案例/气象行业UI界面设计/兰亭妙微

蓝蓝设计的小编

冬奥智慧气象 APP 是专门面向国内外 IOC(国际奥委会)官员、冬奥会的组织与管理者、运动员与教练员以及关注冬奥会比赛进程的公众用户,通过该 APP 向国内、国外用户提供权威、准确、及时的官方气象服务信息,并作为冬奥会官方气象服务网站的有力补充,通过智能手机向用户提供优质的冬奥气象服务。该 APP 以冬奥比赛场地的预报、实况和预警的气象服务为设计重点,面向不同用户的天气需求进行定制化开发。开发原则上以服务用户为主,创新设计服务流程和服务模式,让国内外用户能够体验到冬奥气象服务的实用和贴心,并具有一定的科技感和获得感。蓝蓝设计负责 UI设计部分。本项目历时二年,经历无数修改及设计开发完毕后的推倒重来,在冬奥气象专家的指导下,结合了国际赛事运动员和专业人士的习惯,设计出符合其产品特性的人性化界面。

移动端UI设计与PC端网页UI设计差异

蓝蓝设计的小编

在数字化时代,UI设计是连接用户与产品或服务的关键桥梁。随着设备的多样化,移动端UI设计与PC端网页UI设计虽然在目标上追求用户体验的优化,但在具体实践中却展现出诸多不同。本文将从屏幕尺寸、交互方式、设计原则、性能要求及用户习惯等几个方面,深入探讨两者之间的差异。

无障碍设计对App界面设计的意义

蓝蓝设计的小编

在数字化时代,App已成为人们日常生活的重要组成部分,它们为用户提供了便捷的信息获取和服务体验。然而,对于一部分特殊群体而言,如视障、听障、行动不便等人士,使用App可能仍然面临诸多障碍。因此,无障碍设计在App界面设计中的意义显得尤为重大。本文将从多个方面探讨无障碍设计对App界面设计的意义。

情感化设计对App界面设计的影响

蓝蓝设计的小编

在数字化浪潮中,App已成为人们日常生活的重要组成部分,它们不仅满足了我们的功能需求,更在情感层面与我们紧密相连。情感化设计作为App界面设计的一种重要理念,正逐渐渗透并深刻影响着用户的体验与感知。本文将从多个维度探讨情感化设计对App界面设计的影响。

App界面设计方法指南

蓝蓝设计的小编

在移动应用(App)日益普及的今天,一个优秀的界面设计不仅是功能实现的载体,更是吸引用户、提升用户体验的关键。本文旨在提供一份App界面设计方法指南,帮助设计师和开发者们打造出既美观又实用的用户界面。

交互设计对App界面设计的影响

蓝蓝设计的小编

在数字化时代,移动应用(App)已成为人们日常生活中不可或缺的一部分,无论是社交娱乐、购物支付还是健康管理,App都以其便捷性和高效性赢得了用户的青睐。而在这背后,交互设计作为连接用户与产品的桥梁,对App界面设计产生了深远影响,它不仅塑造了产品的第一印象,更决定了用户体验的优劣。

交互设计在App界面设计中的核心作用

蓝蓝设计的小编

在移动互联网高速发展的今天,App作为用户与数字世界交互的重要窗口,其界面设计直接影响着用户体验的优劣。而交互设计作为App界面设计中的关键一环,更是扮演着举足轻重的角色。本文将深入探讨交互设计在App界面设计中的核心作用,以及它是如何提升用户体验的。

用户体验在App界面设计中的核心作用

蓝蓝设计的小编

在数字化时代,移动应用程序(App)已成为人们日常生活不可或缺的一部分,无论是社交娱乐、在线购物、健康管理还是工作学习,App都以其便捷性和高效性赢得了用户的青睐。然而,在众多App中脱颖而出,除了强大的功能和丰富的内容外,一个关键因素便是其卓越的用户体验(UX)。用户体验,简而言之,就是用户在使用产品或服务过程中建立起来的主观感受,它贯穿于App界面设计的每一个环节,对产品的成功至关重要。

APP界面设计优缺点分析

蓝蓝设计的小编

在移动互联网时代,APP已成为人们日常生活中不可或缺的一部分。而APP界面设计作为用户与应用程序之间的桥梁,其质量直接影响着用户的体验和满意度。本文将从APP界面设计的优点与缺点两个方面进行深入分析,以期为开发者提供有价值的参考。

APP界面设计优缺点分析

优点分析


1. 直观性与易用性

优秀的APP界面设计往往能够直观展示应用的功能和操作方式,降低用户的学习成本。通过合理的布局、清晰的图标和简洁的文案,用户可以迅速理解并上手使用,提高了应用的易用性和用户满意度。

2. 视觉吸引力

界面设计的美观程度直接关系到用户的第一印象。一个设计精良、色彩搭配和谐、视觉效果出众的APP界面能够迅速吸引用户的眼球,激发用户的探索欲望,提升应用的吸引力和留存率。

APP界面设计优缺点分析

3. 个性化与定制化

随着用户需求的多样化,个性化与定制化成为APP界面设计的重要趋势。通过提供丰富的主题、字体、布局等选项,让用户根据自己的喜好进行定制,不仅能够满足用户的个性化需求,还能增强用户的归属感和忠诚度。

4. 交互性与反馈

良好的交互设计和即时的反馈机制是提升用户体验的关键。通过设计合理的交互动作、动画效果和声音提示等,能够使用户在操作过程中获得更加流畅和自然的体验。同时,即时的反馈机制能够让用户了解操作的结果,减少误操作和焦虑感。

APP界面设计优缺点分析

缺点分析


1. 信息过载

部分APP为了追求功能的全面性,在界面上堆砌了大量信息和元素,导致用户在使用时感到信息过载,难以快速找到所需内容。这不仅降低了用户的使用效率,还可能引发用户的厌烦情绪。

2. 复杂性与冗余

过于复杂的界面设计和冗余的功能模块会增加用户的学习成本和使用难度。用户在面对复杂的操作时容易感到困惑和挫败,从而放弃使用应用。因此,界面设计应追求简洁明了,避免不必要的复杂性和冗余。

APP界面设计优缺点分析

3. 一致性缺失

界面设计的一致性是保持用户体验连贯性的重要因素。然而,部分APP在界面设计上存在风格不统一、元素不一致等问题,导致用户在使用时感到混乱和不适。这不仅破坏了用户的视觉体验,还可能影响用户对应用的整体评价。

4. 忽视无障碍设计

无障碍设计是确保所有人都能平等、方便地使用APP的重要手段。然而,部分APP在界面设计时忽视了无障碍设计的重要性,导致部分用户(如视力障碍者、肢体障碍者等)无法正常使用应用。这不仅违反了相关法律法规,也损害了应用的社会形象和品牌形象。

APP界面设计优缺点分析

综上所述,APP界面设计在提升用户体验和满足用户需求方面发挥着重要作用。然而,在实际设计中也存在一些问题和挑战。开发者应充分认识到界面设计的优缺点,不断优化和改进设计方案,以提供更加优质、易用、个性化的APP体验。

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档