首页 > 其他分享 >拯救低效!摹客RP高保真三方组件库等你来用!

拯救低效!摹客RP高保真三方组件库等你来用!

时间:2023-06-23 12:32:01浏览次数:44  
标签:高保真 RP 摹客 Design 设计 组件 UI

摹客RP内置三方组件库自从4月上线后,好评如潮。提供多个国内外大厂高保真UI组件库,拖拽即用,大大提高了大家的原型设计效率!

当然我们也关注到了大家的使用反馈,也在持续的对组件的样式、交互等进行优化,并持续新增大家需要的UI组件库。

在近期的更新中,我们就对组件库进行了一波优化,也上新了多个常用三方组件库。

今天我们就来一起详细了解一下什么是UI组件库和它的作用,摹客RP中都内置哪些组件库以及如何使用等!

什么是UI组件库?有什么作用?

简单理解组件库就是一套可重复使用的用户界面(UI)组件集合,涵盖了各种常见的界面元素,如按钮、输入框、菜单、导航菜单等等。 UI组件库中的组件都是经过精心设计,样式统一。许多大型科技公司和互联网巨头都有自己的UI组件库,用于其产品的设计和开发过程,减少重复的人力投入,通过统一、完善的组件生态提升设计开发效率。很多公司也会将他们的UI组件库开源供大家使用!

那么UI组件库有什么作用和好处呢?对于产品设计过程来说其作用主要体现在以下两点:

  • 提高设计效率:不管是产品经理还是设计师都可以直接使用现成的组件,快速搭建原型或界面,避免从头开始设计每个UI元素。
  • 保持界面设计一致性:通过使用UI组件库,可以确保产品各个部分在外观和交互上保持一致。这有助于消除不同设计师之间的设计风格差异,提供统一的用户界面,使得用户在不同页面和功能之间的切换更加自然。


摹客RP有哪些组件库?

除了摹客RP自带的预设组件库外,目前摹客已经提供了8个国内外大厂高保真UI组件库,包括Ant Design,Element UI,TDesign,Arco Design,WeUI,iOS,macOS和Material Design。所有大厂UI组件库资源均可在摹客RP内拖拽即用,十分方便。

  • Ant Design:阿里巴巴蚂蚁集团出品的B端组件库,企业级中后台产品的交互语言和视觉风格。

拯救低效!摹客RP高保真三方组件库等你来用!_UI

  • Element UI:饿了么出品的桌面端组件库,多数用于后台管理系统的页面设计和开发。

拯救低效!摹客RP高保真三方组件库等你来用!_原型设计_02

  • TDesign:是腾讯各业务团队在服务业务过程中沉淀的一套企业级设计体系。

拯救低效!摹客RP高保真三方组件库等你来用!_UI_03

  • Arco Design:字节跳动出品一款企业级产品设计系统,主要服务于字节跳动旗下中后台产品的体验设计和技术实现。

拯救低效!摹客RP高保真三方组件库等你来用!_UI_04

  • WeUI:微信官方设计团队专门为微信内网页和微信小程序定制的一款组件库。

拯救低效!摹客RP高保真三方组件库等你来用!_UI_05

  • iOS:苹果公司为iPhone开发的手机操作系统,其组件库涵盖了丰富的 iOS 界面元素。

拯救低效!摹客RP高保真三方组件库等你来用!_UI_06

  • macOS: 苹果笔记本电脑macbook的操作系统,其组件库涵盖了丰富的 macOS 界面元素。

拯救低效!摹客RP高保真三方组件库等你来用!_UI_07


  • Material Design:Google所发布的设计系统,被广泛应用于各种Web、移动和桌面应用程序的开发中。

拯救低效!摹客RP高保真三方组件库等你来用!_UI_08


如何在摹客RP中使用三方组件库?

第一步:选择组件或组件库

  • 方法一:在摹客RP左侧组件面板中找到切换组件库按钮。选择组件库后,根据不同组件分类找到你想使用的组件或者你也可以通过切换组件库按钮旁的搜索按钮,在当前你选中的组件库中搜索组件。

拯救低效!摹客RP高保真三方组件库等你来用!_原型设计_09

  • 方法二:左侧组件面板顶部搜索框中可以进行全局搜索。直接输入组件名称即可在全部组件库中搜索对应组件。

拯救低效!摹客RP高保真三方组件库等你来用!_UI_10

第二步:拖拽组件到画板。

将组件拖拽到画板的过程中,支持实时显示组件最终呈现的效果,所见即所得,便于准确的放置组件到对应位置,减少后续二次拖动和调整,十分方便快捷!

拯救低效!摹客RP高保真三方组件库等你来用!_原型设计_11


第三步:对组件进行编辑。

你可以根据自己的需求对组件进行二次编辑,如替换图标,替换文字等操作。

拯救低效!摹客RP高保真三方组件库等你来用!_原型设计_12


第四步:为组件设置交互等。

你可以点击右上角的圆点,拖向目标即可快速创建交互。

拯救低效!摹客RP高保真三方组件库等你来用!_原型设计_13

好了,以上就是本期对于摹客RP三方组件库的全部内容了,快去试试吧!

点击了解更多

标签:高保真,RP,摹客,Design,设计,组件,UI
From: https://blog.51cto.com/u_9540389/6537673

相关文章

  • 下载rabbitmq和erlang的.rpm文件
    今天也是从网上找了好久下载资源地址,看到了有些文章需要花钱才能拿到文件,有些文章不是全部都有,特此记录一下!1.首先进入rabbitmq官网找,查看rabbitmq对应的erlang之间对应的版本信息网址:RabbitMQErlangVersionRequirements—RabbitMQ2.在github网站下载erlang的.npm文......
  • nginx-1.22.1的rpm包,乱打。
    环境准备主机名WanIPLanIP应用角色web0110.0.0.7172.16.1.7fpm打包工具web0210.0.0.8172.16.1.8yumrepoyum仓库web0310.0.0.9172.16.1.9安装rpm包的客户端web01安装fpm打包工具#0.安装依赖[root@web01~]#yuminstall-yrpm-build#1.......
  • frp 内网到内网穿透
    下载frp_0.34.2_linux_amd64.tar到公网ECS和内网服务器 一、公网ECS做为服务端1.1解压文件到/usr/local/frps1.2修改/usr/loacl/frps/frps.ini内容如下:[common]bind_port=7000  #服务端口dashboard_port=8510  #监控界面端口dashboard_user=userabc #监控......
  • vulnhub靶场:matrix-breakout-2-morpheus
    这个靶场的链接不小心给关闭了,所以只能自己去搜了,好像这个靶场需要用virtualbox,但是我的好像有问题,所以用VMware了,这是我打开后的样子我的kali的ip:192.168.13.129对靶场进项扫描nmap-sP65535192.168.13.0/24稍微判断下,锁定在147和254然后扫描它,发现147是靶场的ip  ......
  • nginx-1.22.1版本的rpm包,自己手动打。
    环境准备主机名WanIPLanIP应用角色web0110.0.0.7172.16.1.7fpm打包工具web0210.0.0.8172.16.1.8yumrepoyum仓库web0310.0.0.9172.16.1.9安装rpm包的客户端web01安装fpm打包工具#0.安装依赖[root@web01~]#yuminstall-yrpm-build#1.......
  • 在Linux中执行.sh脚本,异常/bin/sh^M: bad interpreter: No such file or directory。
    在Linux中执行.sh脚本,异常/bin/sh^M:badinterpreter:Nosuchfileordirectory。 分析:这是不同系统编码格式引起的:在windows系统中编辑的.sh文件可能有不可见字符,所以在Linux系统下执行会报以上异常信息。解决:1)在windows下转换: 利用一些编辑器如UltraEdit或EditPlus等工具先......
  • gRPC 的 RoadMap 20160325 更新
    gRPC是一个高性能、通用的开源RPC框架,其由Google主要面向移动应用开发并基于HTTP/2协议标准而设计,基于ProtoBuf(ProtocolBuffers)序列化协议开发,且支持众多开发语言。下面我们就从HTTP2、ProtoBuf3、Nginx、gRPC的角度看他们的RoadMAP。HTTP22015年5月HTTP2协议正式版发布:RF......
  • node生成token报错:secretOrPrivateKey has a minimum key size of 2048 bits for RS25
    提要:在node生成token时利用用jsonwebtoken,利用非对称加密的生成token  constjwt=require("jsonwebtoken"); constprivateKey=fs.readFileSync("./keys/private.key");constpublicKey=fs.readFileSync("./keys/public.key");consttok......
  • 网安--burpsuite的target模块
                       定义:以主机或者子域名作为分类对经过bp的流量进行归纳整理,一个文件夹称为一个域  三大作用:域同一个域:协议域名端口相同,文件目录参数可以相同限定域的范围(只拦截/不拦截)设置作用域黑白名单可以同时生效......
  • 不是问题得问题 burpsuite为什么没有显示我要的文件
    问题:我在web访问了png和css文件。但是burp没有先显示,显示是灰色的,表示网页中有链接但是没有请求发出。原因:一种是过滤器过滤掉了,还有一种是浏览器有缓存并没有真正访问下载文件解决方法:第一种情况 在过滤器中点击全部显示,点击应用第二种情况 点击清除数据 ......