百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 编程网 > 正文

你不得不收藏的工具集合(上) 收藏工具app

yuyutoo 2024-10-12 01:16 2 浏览 0 评论

灵感搜集类

设计百宝箱 地址:uirush.com



Behance 地址:behance.net


Dribbble 地址:dribbble.com


解析:设计百宝箱(UI Rush)——导航大全,包含各种设计资源、开发资源,和产品资源等。

DribbbleBehance 许很多设计师都知道这两个网站,不过重点是要学会利用袄。


思维导图、文档协作


百度脑图 地址:naotu.baidu.com


MindNode 地址: mindnode.com


一起写 地址:yiqixie.com


Quip 地址:quip.com


有道云笔记 地址:note.youdao.com


解析:百度脑图是在线的,使用与 MindNode 差不多,不过样式多一些,比较喜欢它的紧凑型功能。适合线上协作。

MindNode,即思维导图,是本地的 App,适用于 Mac 或 IOS 系统,可导出成 PDF、图片或文字等格式。方便本地保存与修改。

一起写是比较专业的企业版文档协作工具,有付费版和免费版。可以创建文档、表格、演示、画板、表单等,也可以导入 Word、Excel、PPT 或云盘文件,可实时多人在线同步编辑,并且可找回历史编辑记录。它也有个本地 APP 可以下载。

除此之外还有一些免费的在线文档协作工具,如石墨有道云协作等,但只支持文章编辑,且比一起写稍逊色一些。

Quip 应该是最好用的文章协作编辑了,bug 少,有电脑和手机端 APP。但是是国外的,需要网络加速器的支持。

有道云笔记体感也还不错,适合个人本地用,电脑和手机端的 APP 内容可以同步。也有线上版本,登录你的网易账户即可。


UI 设计

Sketch 地址:sketchapp.com



Zeplin 地址:zeplin.io


Figma 地址:figma.com


解析:如果还有没开始使用 Sketch 的设计师要特别注意下,现在很多互联网公司对设计师的招聘都要求必须会使用 Sketch 了。

说到 Sketch 就不得不说 Zeplin,它是配合着 Sketch 非常好用的一款插件,设计稿在 Sketch 里完成后直接导入到 Zeplin,设计师们再也不需要为 Style Guide 和尺寸标注烦恼啦,Zeplin 都帮你自动生成好了,从此设计师们跟程序员们之间协作变得更和谐了。

除了 Sketch,UI 设计工具又多了一匹黑马叫 Figma,它有三个显著的特性,实时协作、矢量网格和版本历史。已习惯使用 Sketch 的同学切换到 Figma 上难度不大,操作基本类似。虽还未像 Sketch 一样风靡,但可以尝试一下。


Icon素材


阿里妈妈库 地址:iconfont.cn


Icomoon 地址: icomoon.io


Fontawesome 地址:fontawesome.io/cheatsheet


Material Icons 地址:material.io/icons



解析:设计师找 Icon 素材用阿里妈妈,直接搜索相应的 Icon 名称即可。也有许多成套的免费 Icon Set。现在阿里妈妈升级了,更是多了很多彩色的图标库,知道了还不快赶快去抢啊!

Icomoon 是设计师与程序员协作时主要用到的工具,当然上面也有一些免费的和收费的 Icon 库。但 Icomoon 的最吸引人的是它的编辑功能,设计师们再也不需要去纠结怎么把 Icon 调到画布居中的问题了,它可以挪动、旋转、放大缩小,居中、去色一个 Icon。另外,它还可以将选中的 Icon 生成 Font 袄。

FontawesomeMaterial Icons(Google 出品) 类似,都是程序员在没有拿到设计师的 Icon 前,喜欢自己直接用的 Icon 库,它们的 Icon 都够多够全,做工具类产品的设计师会喜欢的。


原型交互展示


Marvel 地址:marvelapp.com


lnvision 地址:invisionapp.com


Principle 地址:principleformac.com


Atomic 地址:atomic.io


Framer 地址:framer.com


墨刀 地址:modao.cc


解析:MarvelInvision 用起来感觉差不多,付费版的 Marvel 还可以下载本地 Html 文件,电脑和手机端都可以保存本地版本预览,免除了在线预览国外网站网速慢的痛苦。一般公司内部展示用免费版即可,除非你是做外包展示,或者公司是要靠一个项目区融资的,可以用一下付费版的。

Principle 主要用于实现交互动效,操作比 Marvel 和 Invision 复杂些。它有本地的 App 可提供下载。很多复杂炫酷的原型交互效果都是用 Principle 做出来的。如下:



Atomic 和 Principle 差不多。而 Framer 适合懂点前端代码的设计师使用。

最后想了下,还是放上了墨刀,这是国内的一款原型展示工具。想用墨刀的一般都建议还是Marvel,但如果你们公司的网速实在卡得要死,而且也一直不打算去解决这个问题的话,那就用墨刀吧......

相关推荐

jQuery VS AngularJS 你更钟爱哪个?

在这一次的Web开发教程中,我会尽力解答有关于jQuery和AngularJS的两个非常常见的问题,即jQuery和AngularJS之间的区别是什么?也就是说jQueryVSAngularJS?...

Jquery实时校验,指定长度的「负小数」,小数位未满末尾补0

在可以输入【负小数】的输入框获取到焦点时,移除千位分隔符,在输入数据时,实时校验输入内容是否正确,失去焦点后,添加千位分隔符格式化数字。同时小数位未满时末尾补0。HTML代码...

如何在pbootCMS前台调用自定义表单?pbootCMS自定义调用代码示例

要在pbootCMS前台调用自定义表单,您需要在后台创建表单并为其添加字段,然后在前台模板文件中添加相关代码,如提交按钮和表单验证代码。您还可以自定义表单数据的存储位置、添加文件上传字段、日期选择器、...

编程技巧:Jquery实时验证,指定长度的「负小数」

为了保障【负小数】的正确性,做成了通过Jquery,在用户端,实时验证指定长度的【负小数】的方法。HTML代码<inputtype="text"class="forc...

一篇文章带你用jquery mobile设计颜色拾取器

【一、项目背景】现实生活中,我们经常会遇到配色的问题,这个时候去百度一下RGB表。而RGB表只提供相对于的颜色的RGB值而没有可以验证的模块。我们可以通过jquerymobile去设计颜色的拾取器...

编程技巧:Jquery实时验证,指定长度的「正小数」

为了保障【正小数】的正确性,做成了通过Jquery,在用户端,实时验证指定长度的【正小数】的方法。HTML做成方法<inputtype="text"class="fo...

jquery.validate检查数组全部验证

问题:html中有多个name[],每个参数都要进行验证是否为空,这个时候直接用required:true话,不能全部验证,只要这个数组中有一个有值就可以通过的。解决方法使用addmethod...

Vue进阶(幺叁肆):npm查看包版本信息

第一种方式npmviewjqueryversions这种方式可以查看npm服务器上所有的...

layui中使用lay-verify进行条件校验

一、layui的校验很简单,主要有以下步骤:1.在form表单内加上class="layui-form"2.在提交按钮上加上lay-submit3.在想要校验的标签,加上lay-...

jQuery是什么?如何使用? jquery是什么功能组件

jQuery于2006年1月由JohnResig在BarCampNYC首次发布。它目前由TimmyWilson领导,并由一组开发人员维护。jQuery是一个JavaScript库,它简化了客户...

django框架的表单form的理解和用法-9

表单呈现...

jquery对上传文件的检测判断 jquery实现文件上传

总体思路:在前端使用jquery对上传文件做部分初步的判断,验证通过的文件利用ajaxFileUpload上传到服务器端,并将文件的存储路径保存到数据库。<asp:FileUploadI...

Nodejs之MEAN栈开发(四)-- form验证及图片上传

这一节增加推荐图书的提交和删除功能,来学习node的form提交以及node的图片上传功能。开始之前需要源码同学可以先在git上fork:https://github.com/stoneniqiu/R...

大数据开发基础之JAVA jquery 大数据java实战

上一篇我们讲解了JAVAscript的基础知识、特点及基本语法以及组成及基本用途,本期就给大家带来了JAVAweb的第二个知识点jquery,大数据开发基础之JAVAjquery,这是本篇文章的主要...

推荐四个开源的jQuery可视化表单设计器

jquery开源在线表单拖拉设计器formBuilder(推荐)jQueryformBuilder是一个开源的WEB在线html表单设计器,开发人员可以通过拖拉实现一个可视化的表单。支持表单常用控件...

取消回复欢迎 发表评论: