[PM]原型与交互设计

原型分类

1.草图原型

手绘图稿, 规划的早期,整理思路会使用

2.低保真原型

简单交互, 无需配色, 黑白灰为主, 产品规划和评审阶段使用

标准化的低保真原型是高保真原型的基础

3.高保真原型

复杂交互, 一般用于公开演示,

产品先产出低保真原型, 设计师根据原型产出设计稿

低保真原型+设计稿=高保真原型

Axure

1.操作界面

①菜单区 ②图层区 ③组件区 ④绘图区 ⑤样式区

2.常用操作
  1. 新建文件: 文件->新建
  2. 打开文件: 文件->打开
  3. 保存文件: 文件->保存
  4. 主要文件类型
  • .rp: 原型文件
  • .rplib: 元件库文件
  • .rpteam 团队项目文件
  • .html 网页文件
  1. 自动保存: 偏好设置->启用备份
  2. 组合: Ctrl+G
  3. 发布: 将原型生成HTML文件 -> 建议先新建文件夹
  4. 帮助: 关于Axure ->查看版本
  5. 帮助: 管理授权->破解软件
  6. 添加原件库: 元件库 + 号
  7. 移除元件库: 打开元件库->更多->移除元件库
3.样式设计

把元件拖至画布, 修改样式

4.交互设计

交互就是人机的互动过程, 交互设计就是对交互的规则和表现进行设计

在Axure中, 交互分为交互样式和交互逻辑

1.交互样式内置了常见的样式变化, 使用方便但是无法设置逻辑

2.交互逻辑的设置更加灵活, 通过给元素添加事件和添加动作, 完成个性的样式和逻辑交互

3.设置好的交互效果需要再预览中查看

5.中继器

中继器的作用是实现结构的复用, 无需一直复制粘贴

  1. 创建一个中继器, 双击中继器进入编辑模式
  2. 给元件都做好命名, 方便后续绑定数据
  3. 退出编辑, 填充表格数据 (列名只支持英文)
  4. 视图->遮罩->关闭中继器遮罩

6.动态面板

利用动态面板实现内容切换效果

  1. 添加左侧导航栏
  2. 添加右侧动态面板
  3. 双击动态面板进入编辑模式
  4. 不同状态设置不同元素

  1. 给导航添加点击事件, 并设置动态板面状态

  1. 预览效果

原型规范

手机和电脑App的区别:

  1. 屏幕适配 (屏幕尺寸, 分辨率)
  2. 交互方式 (鼠标比手指控制精准)
PC端

1.版心

现在主流分辨率是 1920 * 1080, 所以版心一般在 960-1200之间, 一般建议为1200

2012年以前, 主流分辨率是 1024 * 768, 所以版心为760

2.导航

3.表单

4.列表

M端

移动端没有固定的尺寸规范, 通过根据适配机型的尺寸制作原型, 如 iphone6 的尺寸为 375 * 667

1.固定元素的尺寸

2.常见区域

3.常见展现形式

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/46370.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Vue3学习体验(一)

搭建工程 使用vue-cli脚手架创建vue3工程 vue create vue3-app-vue-cliVue-cli官网:https://cli.vuejs.org/zh/guide/installation.html 使用vite搭建vue3工程 npm init表示临时的下载vite应用来创建vue3工程,工程名称为vue3-app-vite npm init vit…

mount挂载

1)Vmvare挂载光驱设备 安装光驱设备后,可以看到设备文件。 ls /dev/sr0 ll /dev/cdrom虽然设备是以文件的形式出现的,但和一般的文件不一样。 2)mount挂载 目录是目录,设备是设备,mount挂载可以让目录成…

数据结构——查找(线性表的查找与树表的查找)

目录 1.查找 1.查找的基本概念 1.在哪里找? 2.什么查找? 3.查找成功与否? 4.查找的目的是什么? 5.查找表怎么分类? 6.如何评价查找算法? 7.查找的过程中我们要研究什么? 2.线性表…

Spring webflux基础核心技术

一、 用操作符转换响应式流 1 、 映射响应式流元素 转换序列的最自然方式是将每个元素映射到一个新值。 Flux 和 Mono 给出了 map 操作符&#xff0c;具有 map(Function<T&#xff0c;R>) 签名的方法可用于逐个处理元素。 当操作符将元素的类型从 T 转变为 R 时&#xf…

OpenCV和CUDA匹配,使用源码构建OpenCV

当你使用pip安装opencv-contrib-python时&#xff0c;实际上你是在安装一个预编译的二进制包&#xff0c;这个包并不包含源代码。预编译的包是为特定的Python版本和操作系统架构准备的&#xff0c;所以当你安装时&#xff0c;你不需要源代码&#xff0c;也不需要使用CMake或进行…

qt 获取父控件

在 Qt 中&#xff0c;你可以通过调用 QWidget 的 parentWidget() 方法来获取一个控件的父控件。这个方法会返回一个指向父控件的指针&#xff0c;如果该控件没有父控件&#xff0c;则返回 nullptr。 以下是一个简单的示例&#xff0c;展示了如何获取一个按钮的父控件&#xff…

基于conda包的环境创建、激活、管理与删除

Anaconda是一个免费、易于安装的包管理器、环境管理器和 Python 发行版&#xff0c;支持平台包括Windows、macOS 和 Linux。下载安装地址&#xff1a;Download Anaconda Distribution | Anaconda 很多不同的项目可能需要使用不同的环境。例如某个项目需要使用pytorch1.6&#x…

SAP 消息输出 - Adobe Form

目录 1 安装链接 2 前台配置 - Fiori app 2.1 维护表单模板 (maintain form templates) 2.2 管理微标 (manage logos) 2.3 管理文本 (manage texts) 3 后台配置 3.1 定义表单输出规则 3.2 分配表单模板 SAP 消息输出&#xff0c;不仅是企业内部用来记录关键业务操作也是…

WPF中Frame

在Windows Presentation Foundation (WPF) 中&#xff0c;Frame 控件是一个非常重要的元素&#xff0c;主要用于实现页面导航和内容的动态加载。Frame 类似于网页开发中的iframe&#xff0c;但它是WPF应用程序中的一个容器&#xff0c;能够显示不同的页面或控件内容。 以下是F…

【学习笔记】无人机(UAV)在3GPP系统中的增强支持(一)-3GPP TR 22.829 V17.1.0技术报告

本文是3GPP TR 22.829 V17.1.0技术报告&#xff0c;专注于无人机&#xff08;UAV&#xff09;在3GPP系统中的增强支持。文章提出了多个无人机应用场景&#xff0c;分析了相应的能力要求&#xff0c;并建议了新的服务级别要求和关键性能指标&#xff08;KPIs&#xff09;。 下载…

算法导论 总结索引 | 第五部分 第十八章:B树

1、B 树是 为磁盘或其他直接存取的辅助存储设备 而设计的一种平衡搜索树。B 树类似于红黑树&#xff0c;在降低磁盘 I/O 操作次数方面要更好一些。许多数据库系统 使用 B 树 或者 B 树 的变种来存储信息 2、B 树与红黑树的不同之处 在于 B 树的结点 可以有很多孩子&#xff0c…

STM32-寄存器点灯案例详解

本文以PA1引脚点亮LED灯为案例&#xff0c;解析了STM32寄存器操作的配置过程&#xff0c;以及从手册查询方法和寄存器配置步骤。 一、概念 1.十六进制和二进制之间相互转换关系 首先&#xff0c;需要了解十六进制和二进制之间的基本转换方法。十六进制是一种基数为16的数制&…

制作显卡版docker并配置TensorTR环境

感谢阅读 相关概念docker准备下载一个自己电脑cuda匹配的docker镜像拉取以及启动镜像安装cudaTensorRT部署教程 相关概念 TensorRT是可以在NVIDIA各种GPU硬件平台下运行的一个模型推理框架&#xff0c;支持C和Python推理。即我们利用Pytorch&#xff0c;Tensorflow或者其它框架…

QEMU源码全解析 —— CPU虚拟化(1)

接前一篇文章: 本文内容参考: 《趣谈Linux操作系统》 —— 刘超,极客时间 《QEMU/KVM》源码解析与应用 —— 李强,机械工业出版社 特此致谢! 零、序言 一晃已经很久(4个多月)没有更新QEMU这个专栏了。并不是本系列已经完结了,也不是笔者不想写、或者已经失去了继续…

Docker--在linux安装软件

Docker 引用Docker原因是在linux中安装软件 以前在linux中安装软件&#xff0c;是直接安装在linux操作系统上&#xff0c;软件和操作系统耦合度很高&#xff0c;不方便管理&#xff0c;因为linux版本不同&#xff0c;环境也就改变了 docker是一种容器技术&#xff0c;提供标…

7-4 数组逆序(重庆专本贯通C语言大一期末考试题目详解)

分数 10 入门 全屏浏览 切换布局 作者 Jackson 单位 上海大学 给你 n 个整数&#xff0c;将其逆序输出。 输入格式: 第一行一个整数 n &#xff08;3<n<10) 代表数的个数。 第二行 n 个整数&#xff08;空格隔开&#xff09;&#xff08;这些数在 0~10^6 之间)。…

概率论原理精解【3】

文章目录 向量值向量值函数导数向量值函数定义性质应用示例 向量值函数的导数定义性质应用 向量值 向量值函数导数 D R ⊂ R n , 向量值函数 f : D n → R m D^R \subset R^n,向量值函数f:D^n\rightarrow R^m DR⊂Rn,向量值函数f:Dn→Rm 复合函数 f i : π i ∘ f , i 1 , 2…

frameworks 之FallbackHome

frameworks 之FallbackHome FallbackHome 启动启动 Activity 流程创建进程ActivityThrad 与 AMS启动真正的 Launcher mActivityManagerService 创建后会启动 FallbackHome 再启动桌面程序。因为此时还没解锁&#xff0c;桌面又涉及很多其他应用程序相关&#xff0c;所以要等待用…

Flutter EasyRefresh:介绍与使用指南

什么是 Flutter EasyRefresh&#xff1f; Flutter EasyRefresh 是一个强大的下拉刷新和上拉加载组件&#xff0c;用于构建流畅且高效的 Flutter 应用程序。它提供了多种自定义配置和动画效果&#xff0c;使开发者可以轻松实现列表的刷新和加载功能。 主要功能 支持下拉刷新和…

Python学生信息管理系统的设计与实现

在本篇博客中&#xff0c;我们将深入探讨一个基于Python的简单学生信息管理系统的设计与实现过程。这个系统允许用户执行诸如添加、删除、修改和查询学生信息等操作。我们将逐步解析代码&#xff0c;理解其中的关键概念和编程实践。 1. 系统概述 该系统由几个核心功能组成&am…