当前位置:

首页 > 系统应用 > 1.7 界面原型设计

1.7 界面原型设计

本文目录

    本节引言: 引用锤子科技视觉设计总监——罗子雄在重庆TEDx活动上说的一小段话: 每当我们看到一些美妙的设计的时候,很多人心里面会有一种冲动,这种冲动会让你们想去创造一些 新的东西,创造一些美妙的事物。 我们常说用户体验用户体验,用户使用你的软件,第一个会接触的是什么?没错,图形化界面(GUI),简

    本节引言:

    引用锤子科技视觉设计总监——罗子雄在重庆TEDx活动上说的一小段话:

    每当我们看到一些美妙的设计的时候,很多人心里面会有一种冲动,这种冲动会让你们想去创造一些 新的东西,创造一些美妙的事物。

    我们常说用户体验用户体验,用户使用你的软件,第一个会接触的是什么?没错,图形化界面(GUI),简称UI,对于用户而言,最直观,给用户留下第一印像的是往往是程序的界面,而非功能!人,总喜欢美的东西,对吧? 假如一样的功能,决定用户取向的,往往是UI!精美的UI!当然还有一些贴心的人性化操作等! 下图两个计算机的App界面:

    先不聊功能,单看UI,你会更偏向哪一个?
    说白了,产品的UI真的很关键。一般在公司里,界面原型设计这件事,通常是由产品经理和美工一起完成的,流程也很清楚:需求分析 ->界面原型设计 ->再进入代码实现。很多人一开始会觉得,界面原型跟开发关系不大,作用似乎没那么明显。但换个角度看,如果以后想自己做一款App,或者岗位往产品经理方向发展,这部分能力其实很难绕开。毕竟未来怎么走,谁也说不准。就企业使用情况来看,大多数团队还是会用Axure Rp,不过这款工具上手确实不算轻松。当然,除了它,原型设计工具其实还有不少选择:

    • Pencil
    • Framer
    • Shireframe
    • UIDesigner
    • Balsamiq Mockups
    • Mockup Builder
    • Mockup
    • FrameBox
    • iPhone Mockup
    • GOOFLOW
    • WireframeSketcher
    • FluidIA
    • Indigo Studio
    • Origami
    • Quartz Composer
    • Justproto
    • Avocado
    • PaintCode
    • Mockplus(摩客)
    • 墨刀等....

    笔者使用过的是两个国产的界面原型设计工具,他们分别是:Mockplus(摩客)和墨刀 本文会简要的介绍下Mockplus的用法!

    Mockplus原型工具的使用:

    有网页版以及客户端版供你选择:Mockplus官网

    Step 1:注册一个你自己的账号,然后新建文件进入编辑界面!(时间关系,这里笔者直接试用) 然后弹出一个原型风格的对话框给我们选择:素描跟线条!

    笔者选择线条:

    我们要做的就是从左边的组件栏中啦控件到手机界面上,当然,我们可以双击某个控件,自定义我们 的样式,比如颜色,背景图片等!

    Step 2:交互实现: 界面原型除了界面外,肯定是少不了交互的,这里我们做一个简单的新闻应用的交互例子给大家体验下: 我们在其中一个新闻类别中添加跳转链接,

    接着我们可以点击右上角的播放按钮:

    接下来我们就可以看具体的交互了,PS:这里可能是网页版的问题,有些图片显示不出来!

    好了,大概的用法就这些,大家可以自己摸索摸索,另外,如果生成文档是要升级为付费用户的哦!一个月6元不贵,就一个早餐钱,当然如果是自己玩玩而已就没必要开了!

    Android自带DroidDraw工具设计Android界面:

    其实,Android自己也带了一个有点“上年头”的界面设计工具。真要跟前面那些看起来很专业、很炫的界面原型工具放在一起比,差距确实不小。可以把它理解成一个独立拆出来的ADT,至于比ADT多出来的那点实用价值,主要也就是能自动生成代码……不过话说回来,对于平时很少接触原型设计的朋友,这个工具上手门槛确实不高,花上1、2分钟基本就能摸清怎么用,还是有一定价值的。

    工具界面:

    图示已经写明相关的操作了,很简单,实践是检验真理的唯一标准,自己下来试试吧!!

    软件下载:droiddrawr.jar

    本节小结:

    本节给大家介绍了下界面原型设计的概念,轻量级Mockplus(摩客)的简单实用,以及Android自带的DroidDraw工具,内容比较简单,还需大家自行实践理解!

    本文内容来源于网友投稿,如有侵权请联系删除。
    作者最新文章
    系统应用
    相关文章 更多
    docker容器自动重启怎么解决 排查原因与修复方法
    docker容器自动重启怎么解决 排查原因与修复方法

    遇到Docker容器频繁自动重启?本文提供从查看容器日志、解读退出代码到配置Restart Policy的完整排查与修复方案,确保服务稳定性。

    Linux设置静态路由命令与永久生效教程
    Linux设置静态路由命令与永久生效教程

    学习如何在Linux中使用命令行添加临时静态路由,并通过修改网络配置文件实现重启后依然有效的永久静态路由设置,涵盖CentOS和Ubuntu的不同配置方法。

    摄像头连接电脑后怎么打开查看实时画面教程
    摄像头连接电脑后怎么打开查看实时画面教程

    摄像头连接电脑后不知如何查看画面?本教程演示如何使用Windows自带的“相机”应用快速调取实时视频流,无需下载额外软件,步骤简单直观,适用于大多数USB及内置摄像头。

    如何在 windows 11 关闭自动关机
    如何在 windows 11 关闭自动关机

    针对 Windows 11 电脑在无人操作时自动关机或重启的问题,本文详解如何通过任务计划程序禁用更新重启任务,并调整电源睡眠策略,从根源解决非预期的自动关机现象。

    电脑摄像头怎么测试人脸识别功能及效果判断方法
    电脑摄像头怎么测试人脸识别功能及效果判断方法

    详细讲解在Windows电脑上测试摄像头人脸识别功能的步骤,包括开启Windows Hello、录入面部数据、不同环境下的效果验证及常见问题排查,帮助用户确认设备兼容性与识别准确率。

    docker 容器无法启动的配置检查命令及排查方法
    docker 容器无法启动的配置检查命令及排查方法

    当 Docker 容器启动后立即退出时,不要盲目重启。本文详解如何通过 docker logs 查看标准输出错误,利用 docker inspect 检查挂载与网络配置,并修正入口点脚本权限问题,提供一套高效的因果排查流程。

    安卓手机投屏到电脑win10怎么设置教程
    安卓手机投屏到电脑win10怎么设置教程

    详解如何利用Windows 10自带功能将安卓手机画面投射至电脑屏幕,涵盖开启步骤、连接技巧及延迟分析,适合临时演示与多屏协作场景。

    移动硬盘解除加密怎么操作?详细步骤教程
    移动硬盘解除加密怎么操作?详细步骤教程

    详细介绍如何在Windows系统中为移动硬盘解除BitLocker加密,包括解锁驱动器、关闭加密功能及监控解密进度的完整操作流程,帮助用户安全移除数据保护。

    笔记本电脑耳机没声音怎么设置?Windows 10解决方法
    笔记本电脑耳机没声音怎么设置?Windows 10解决方法

    本文详解Windows 10笔记本耳机无声音的常见原因与解决方法,涵盖物理接口检查、默认播放设备切换、驱动程序更新及音频增强关闭等操作,并分析蓝牙耳机连接异常的例外场景。

    sata固态硬盘安装win10系统怎么分区详细教程
    sata固态硬盘安装win10系统怎么分区详细教程

    还在为SATA固态硬盘装Win10怎么分区头疼?本教程详解安装过程中的分区步骤,涵盖4K对齐检查、ESP引导分区处理及容量规划建议,助你一次性搞定系统盘,避免后期卡顿与空间浪费。

    查看更多
    精品专题 更多
    装机必备
    装机必备

    正软商城装机必备专区,精选办公、浏览器、安全防护、影音播放、压缩解压、设计创作和系统工具等电脑常用正版软件,帮助用户快速完成新电脑软件配置。

    Windows
    Windows

    正软商城Windows软件专区,汇集适用于Windows电脑的办公、设计、安全防护、影音播放、开发工具和系统优化软件,提供软件介绍、系统要求、正版授权及购买下载服务。

    macOS软件
    macOS软件

    正软商城macOS软件专区,精选适用于Mac电脑的办公、设计、影音、效率、开发和系统工具,提供软件功能介绍、macOS兼容版本、正版授权及购买下载服务。

    Mac软件 更多
    Blender
    Blender
    Windows、macOS 和 Linux

    Blender 是一款免费开源、跨平台的专业 3D 创作软件,集建模、动画、渲染、视频编辑与视觉合成等功能于一体,广泛应用于影视动画、游戏设计和建筑可视化等领域。软件支持 Cycles 物理渲染器与 Eevee 实时渲染引擎,并提供多边形建模、骨骼绑定、物理模拟等专业工具。Blender 兼容 Windows、macOS 和 Linux 系统,安装包轻巧、运行流畅,依托活跃的全球开发者社区持续更新,是从初学者到专业创作者都值得选择的正版 3D 创作工具。

    灵活计算器
    灵活计算器
    macOS/iOS/Android

    灵活计算器是一款笔记式算数应用,支持实时计算、动态关联和云端同步功能。记录、整理和输出之间的过渡会更自然,适合长期写作、做笔记或持续沉淀个人内容。

    赤友清理大师
    赤友清理大师
    macOS

    赤友清理大师是一款为 Mac 设计的智能清理优化工具,可精准扫描垃圾、大文件、重复文件等,释放磁盘空间。做扫描整理、文字提取和表格转换时,它能把识别后的处理步骤接得更顺,资料录入这类场景会省下不少时间。

    WINDOWS 更多
    Blender
    Blender
    Windows、macOS 和 Linux

    Blender 是一款免费开源、跨平台的专业 3D 创作软件,集建模、动画、渲染、视频编辑与视觉合成等功能于一体,广泛应用于影视动画、游戏设计和建筑可视化等领域。软件支持 Cycles 物理渲染器与 Eevee 实时渲染引擎,并提供多边形建模、骨骼绑定、物理模拟等专业工具。Blender 兼容 Windows、macOS 和 Linux 系统,安装包轻巧、运行流畅,依托活跃的全球开发者社区持续更新,是从初学者到专业创作者都值得选择的正版 3D 创作工具。

    Windows 10
    Windows 10
    Windows

    Windows 10 是一款微软推出的经典操作系统,拥有硬件兼容性与多任务处理能力。它更偏向把系统状态查看和常用调节动作放在一起,适合需要持续观察和微调设备状态的场景。

    极度公式
    极度公式
    Windows/macOS/Linux

    极度公式是一款跨平台专业LaTeX公式识别编辑软件,支持OCR公式识别和多平台编辑。和使用说明,避免使用,享受完整功能与稳定支持。做扫描整理、文字提取和表格转换时,它能把识别后的处理步骤接得更顺,资料录入这类场景会省下不少时间。