勾勒出一个网站、软件或者其他产品的UI基本的UI元素非常必要,一些线框工具UI设计工具此时就派上了用场。当你想为你的项目做一个草稿模型,你可以使用这些工具,设计出一个你心目中的外形,让你保持较高层次的抽象而不陷入细节之中。

这篇文章,我们为大家概述一些有用的Web或者手机UI设计工具 ,可获取的PDFs和其他资源,你在你的项目中使用它们。这些经过精心挑选的非常有用的工具让你开始项目的初级设计吧。

Free Mobile GUI PSD


Android GUI PSD

这个Android GUI基于Android 1.5GUI上的元素,用于帮助开源社区进行Android程序开发。大部分元素和实例都是矢量图,方便缩放。字体是Android Sans。

RIM Blackberry PSD

一个完整的图层样式,拥有135个图层。

Android Sketch Stencil Version 1.0

Android OmniGraffle草图模板,这个框线图帮助开发者避免过于关注界面设计,鼓励其聚焦于程序的行为和功能。

All elements of Maemo 5 GUI in PSD

这个可下载的PSD文件包括了提供给Maemo平台的GUI模板。对于开发运行于Maemo平台的GUI原型程序是绝对需要的。

iPhone 4 GUI PSD(视网膜显示)

创新者必备的视网膜显示(640X960)的GUI PSD文件。这个文件非常大,足足有62.7MB,长宽为4074X2986。最大屏幕的电脑只能查看原尺寸的25%-50%。

iPad GUI Kit in PSD

安iPad原始尺寸768X1024制作,绝大部分图形元素使用矢量图形,为高分辨率演示提供很多的放大空间。此版本为PS图层,便于模型设计和客户展示。

Adroid 1.6 Wireframe stencil for Omnigraffle

下载这个漂亮的OmniGraffle 5.x附加线框模板,在1.6 Donut SDK上开发Android程序或者网站吧。

Google Android GUI PSD

矢量版Android GUI元素。

iPad GUI PSD Kit

包括全尺寸的图形界面,256,128,和64像素的图标都有,该包分别包括PSD、PNG、Mac ICNS格式的四种尺寸大小的iPad图形界面。

Google Android PSD

一套Google Android原型的模板

Firework template for Android

Firework版模板,矢量重绘Android UI元素。包中的元素模板根据Android部件名称命名。

Sexy Vector Cell Phone

可缩放到任意大小。可轻松添加自己的图片到屏幕上,所有对象都是分层分组标注好的,非常容易定制。

iPad Stencil for Omnigraffle

包括背景、标题栏、按钮、选择元件等其他iPhone UI元素。列表、标题栏、按钮、滚轮上的文本都是可编辑的。

iPhone App Wrieframe Template

Mobile-iPhone

iPhone GUI Elements

一些非常漂亮的iPhone元素,为分层的PS文件。

iPad and iPhone Design

非常详尽的模板,用它们设计你的iPhone、iPod Touch和iPad软件吧。所有的模板根据OmniGraffle原型手工制作而成,清晰的分组,可缩放,可调整大小,Graffle中方便导出成其他的矢量格式文件。

Design Stencil for iPhone and iPad

一个适合正在设计的iPhone、iPod、和iPad系统程序的模板。此模板是针对那些熟悉UIKit提供默认的视图和控件的发开者的。

Apple iPad fully editable PSD

一个可编辑的PSD格式的Apple iPad。所有图形都是可编辑的,可缩放的矢量蒙版。

Plam Pre PSD

这一套模板包含了一张PSD来帮组设计者使用PhotoShop设计抛光感的界面。

iPhone UI Vector Elements

绝大部分可是的程序都是首先在AI中先有实体模型的。这里是一些非常酷的iPhone UI矢量元素。还包含一些不错的Phtoshop资源或者OmniGraffle格式的iPhone UI文件,甚至都有。

iPad Vector GUI Elements:tabs buttons menus icons

这套模板几乎包含了所有的iPad UI元素,按钮,标签,菜单,键盘和气泡等等。对设计者和开发者都非常有用,她包含了可编辑可缩放的矢量版本(AI)。

Free Social Networking GUI PSD Kits


免费的图形分层Fackbook GUI工具包

为了加快Fackbook应用的UIs或者Fackbook迷页面的开发产生了此工具包,为你节约绘制各种UI组件的时间,可自定义所有文字字、按钮等其他你需要的数据。这个工具集是完全免费的,可用在任何项目之中。

Facebook GUI Free PSD Resorce

FBGUI,一个Facebook图形界面Photoshop资源,让你工作更加轻松。

Facebook Applications

可缩放的元素集合,可用来绘制Facebook应用草图。

Omnigraffle Twitter Widget Stencil

这套工具包含了很多有用的Twitter小工具和徽标。

Wireframing Kits


Best Practice UX Forms Stencil v1.1

一个全面的遵循UX最佳表单设计实践的模板,提供三种不同方式布局表单,每种布局方式各有千秋。此模板还提供不同布局的按钮控件,进度条,可编码的验证输入字段,label等。

Form Elements UI Kit

来自Yahoo!设计模式库中的模板设计工具包的表单元素。

Wireframe Shapes

为Mac OS X准备的准备的一套制作线框图的图形。它有很多基本元素你在UI设计中一定非常需要。

Wrieframe kit for UI Designers

包含非常多的线框工具,比如产品详情,项目列表,头版页,手机模板等。

MBTI sketching pager  for ideation

MBTI构思讨论的草图设计。对理解box的死人格特质有很大帮助。每张纸上描述一个设计的挑战和解决问题的办法。

A4 sketching paper

在对具体功能有了想法之后使用这种草图纸,根据自己的想法构建初步的界面。

Wireframe Magnets(DIY Kit)

这个DIY的磁铁模板基于Konigi线框工具,它包括三张对于白板模型非常有用的元素集。简单把下载的PDFs文件打印为磁铁板,使用干擦标记好,用层压法,然后将它们剪开。

Paper wireframe templates

像PSDs的样子,成品包括七中变化

Wireframe template

非常有用的可打印的草图模板,可下载

iPad Idea Sheet

三张图:一张全尺寸(横向),一张70%(竖直),一张50%(横向)。80个小点可以非常方便的分割在屏幕的水平方向和竖直方向上做分割。

Scenario,Taskflow and Grid Shetch Sheets

一套漂亮的可打印的模板,有助于构思和草图设计。

Free Photoshop browser template

在设计陈述中很需要一个干净的浏览器截图?不用等了!这里有免费的专业的浏览器模板,不同的1024X768,800X600分辨率的都有,以及各种爱好。

Interactive Sketching Notation 0.1

这些符号背后的思想是为了可视化与用户交互的状态和更清晰和迅速的明确用户的动作。

Mobile Full iPhone GUI

对于WinterBoard的使用者来说,这是个测试版,所以可能存在没有风格化的元素。

Android Wireframe Templates(PDF)

Free Keynote UX Stencils

Advertising Stencil Kit

一套非常有用的广告模板

Dragnet website wireframes kit v 0.9

Dragnet网的草图框架工具集,0.9版本,Adobe Fireworks文件。包含超过25中对象,对于快速构建网站原型非常有用。完全免费,可下载。这个工具集包含可web设计的很多元素,例如滚动条,按钮,菜单,Alerts等。

User Interface Design Framework

这套全面的非常漂亮的设计框架包含了一个GUI库,有成百上千的矢量元素,可用来做界面设计。小巧的UI图标集包含了260个矢量图形,还包含200个AI样式。

Browser Form Elements PSD

包括两套模板,Mac中Firefox 3和Vista中的IE7

Sketching and Wireframing Kit

一套草图线框元素集,表单元素,图标,指示器,反馈信息,导航元素,图片占位,嵌入式视频,滑块以及普通广告banners应有尽有。

Photoshop Form Element Templates

包含各种常见的表单域以及鼠标指针,非常易于使用。

Web Browser Elements

集中于一个易编辑的PSD文件上,包括一些下拉菜单,输入框,单选框,复选框,按钮,文本域已经滚动条等,很棒,非常易于使用。

UI Design Kit

这套 Web UI工具使用 图形对象制作,有些情况下可转化为智能对象,有很好的缩放性。

Wireframe Symbols

下载包包括一套符号库以及一套完整的AI文件。所以元素在画图板上都被区分开来。如何使用这个库?简单的将Wireframe Symbols.ai上的元素拖放到AI符号库里。每次你需要的时候,从符号库里拖出来就好了。

Web UI Element Pack

PSD格式,19中web 元素。包括,加载条,默认状态按钮和按下状态按钮,按钮切换,关闭图标,”上一个“,”下一个“按钮,分页图标,以及滑块。

Wireframe Kit for Google Drawings

OmniGraffile Stencil for Ext JS v3.0

这个Ext JS Omnigraffle模具的升级版包含了很多提高和补充,如以Graffletopia形状以及组重建绝大多数的Ext JS 元素,尤其在对缩放标题,表格等有很大的帮助。

Flex 3 Stencil

包含所有Flex 3样式指南中的所有组件:面板,数据格,按钮,表单域,连接,开关,菜单,滚动条,折叠,标签,列表,日期Picker,Toolstips以及Error等。

Agua GUI

从GUI设计项目1.2以及Mac OS X界面模板获得灵感,一套基于Aqua,一简化window设计的模板。

Flex Darkskin PSD UI

16张PSD,非常漂亮的模板。

Web Wireframe Kit

这是一套给设计师的简单布局设计的模板,简单,高效,节约时间。

UI Buttons and Icons

包含165个高质量的UI图标和按钮,五种不同颜色。AI,JPEG和SVG格式。

Quommunication Stencil kit

一套包含草图设计的所需的元素,RSS源,颜色,广告单元以及浏览器框和网格。

Mac OS X Interface 2

一套Leopard-y的交互模板工具,在保证像素表现的前提下最大化的运用table获得最大的灵活性。

OmniGraffle UX Template

OmniGraffle Pro(v.5)交互设计模板,包含为基础的UX文档需求提供的共享层(标题页,线框图,和用例面板)。

Template for Blueprint CSS Comps

这个套模板可以以一个CSS布局框架来进行设计,这套AI文件以24网格分割,可适应一些例如Blueprint的CSS框架。

Apple Elements for OmniGraffle

Apple硬件产品以及一些网络设施的模板图。非常适合于制作物理图表。

DevianART ID PSD Kit

15个专业设计,完全可定制化,包含迷你型和原始ID模板。

Browser Screens and Website Elements

一套非常有用矢量资源来帮助你快速搭建客户端程序模型,present你的工作,或者快速布局一个web站点。

960 Grid Template for OmniGraffle

Control of different browsers for designers(下载链接)

PSD库,包括Mozilla Firefox,Opera,IE以及Safari不同浏览器的控件。

Useful Articles


  • The Importance of Wireframing

一篇全面介绍线框设计扮演了如何重要的角色。

  • The Future of Wireframes

随着web设计下一个十年的到来,重新评价和理解线框图的时候到来了,一个经得起用户体验的产品。

  • Wireframing Is Not a Religion

线框设计是一种不可或缺的设计思想,一个数字的草图,随时可以修改擦除或者恢复。

  • Five Commandments for Wireframing

Paul Boag是一个线框设计迷,坚信线框设计是设计进程中不可缺少的部分。他在设计中坚持五个牢不可破的规则。

  • 20 Steps to Better Wireframing

项目开发过程中可能最大的错误就是没有定制计划,这篇文章讨论其原因。

Resources and Round-Ups


  • I Love Wireframing

一个tumblog专注于线框,原型,实物设计。

  • Wireframe Showcase

在这个网站可以查看一些基于线框设计的网站,可分析学习设计人员是如何将实体模型转化为设计的。因为线框和设计都是由设计者自己上传的,每个线框设计都包含了一个简短的说明。大部分的网站原来是数字实物模型,有容易修改和重新设计的优势。起结果是令人愉快的线框设计。

  • Standard Screen Patterns for Web Interface Design

一些互动设计的原则和模式

  • 50 Free UI and Web Design Wireframing Kits and Resources

这篇文章关注一些线框工具和独立的应用程序,包括一些你可以用来制作自己线框图的一些工具:线框工具集,浏览器窗口,表单元素,网格,Mac OS X元素和手机元素,你可以在任何图形编辑器中使用他们,PS,AI,甚至纸笔工具。

  • A Collection of Printable Sketch Templates and Sketch Books for Wireframing

20个资源,用于应用程序开发的草图阶段。

  • A Collection of Printable Web Browser Sketching and Wireframe Templates

这些可打印的草图模板都是特意为web设计人员设计的。附加有浏览器的版本说明(Safari,Chrome甚至Firefox)

  • Useful(Offline) Utensils and Tookits for Designers

当你可以使用一个预制指南来节省时间,更好的发挥你的创造力,为什么还要从头开始设计呢?在这篇文章中,你将得到很多很棒的免费工具,一个笔记集合以及一些要购买的产品来帮助你线下设计。

源地址:Free Wireframing Kits, UI Design Kits, PDFs and Resources – Smashing Magazine_files

WSD:

http://wsd.tencent.com/category/team-torment

MUX:
http://mux.baidu.com/

WEBPPD:

http://www.webppd.com/bbs.php

有用的Web或者手机UI设计工具相关推荐

  1. 一些有用的Web或者手机UI设计工具

    http://www.webjx.com/webmanage/experience-27081.ht ml Webjx.Com提示:最全面的"UI设计与线框图"工具软件. 勾勒出一 ...

  2. 免费的线框工具,UI设计工具,PDFs,资源等

    勾勒出一个网站.软件或者其他产品的UI基本的UI元素非常必要,一些线框工具UI设计工具此时就派上了用场.当你想为你的项目做一个草稿模型,你可以使用这些工具,设计出一个你心目中的外形,让你保持较高层次的 ...

  3. 非常有用的免费UI设计工具和资源

    原文地址为: 非常有用的免费UI设计工具和资源 这篇文章要与大家分享的都是一些很棒的免费UI设计工具和资源,有Web开发方面的,也有移动开发方面的,非常丰富,相信你能从中发现有用的资源.记得推荐一下哦 ...

  4. ui设计师常用的设计工具_2020年应该使用哪个UI设计工具?

    ui设计师常用的设计工具 重点 (Top highlight) It's 2020, the market today is saturated with UI design tools. Ever ...

  5. 8个强大的UI设计工具-设计师利器

    设计良好的用户界面始终是一个具有挑战性的过程,因为总是会影响最终用户的Web服务器或应用.要执行此,这些资源是非常有用的 ,设计人员可以用它来 ​​实现自己的目标.今天分享8个设计师利器-UI设计工具 ...

  6. UI设计工具比较:Sketch、Adobe XD、墨刀、Mockplus、Axure RP

    UI设计工具,分为2个派系. 其中,最大.最主流的派系,是Sketch.Adobe XD.墨刀这个派系. 这个派系的软件,操作方式.思路都非常接近,连常用快捷键都一样,会一个就等于都会了. 在一个无限 ...

  7. android逻辑分辨率,手机ui设计dpi如何把握,看这3个平台各自的画布设置情况

    智能手机的发展可以说是当下科技发展的趋势之一,在智能手机的发展过程中,APP的开发是关键.而dpi是影响APP设计的重要因素之一.今天就让小编为大家介绍手机ui设计dpi如何把握. 手机ui设计dpi ...

  8. 国外一些好用的UX/UI设计工具和资源分享

    国外一些好用的UX/UI设计工具和资源分享 你今天使用的设计工具也许不再适合以后的网页和APP设计项目了.新的工具不断的推出市场,目标只有一个,让你的工作更快.更容易而且工作成效更好.今天分享的这些U ...

  9. 更懂中国设计师的ui设计工具来了

    作为一名设计师,我对国产UI设计工具这事一直挺关注,也希望市面上能出现一款更符合中国设计师需求和使用习惯的好产品. 就在今天,摹客正式开启了摹客DT的公测计划,同时也打出了"更懂中国设计师& ...

最新文章

  1. Good Bye G.cn
  2. python学习之——利用urllib2抓取网页内容
  3. C# 数组与 list 互相转换案例
  4. video 属性和事件用法大全
  5. 计算机设备管理系统报告,设备管理信息化自查报告
  6. 《天勤数据结构》笔记——假溢出和循环队列基本操作的实现(C/C++)
  7. IP地址转换与域名解析
  8. 网上书城项目-LoadRunner压力测试
  9. php生产环境配置,PHP生产环境配置 - osc_ifi9q17t的个人空间 - OSCHINA - 中文开源技术交流社区...
  10. linux手机版模拟电脑,在你的PC上体验Firefox OS 1.3 模拟器
  11. Mysql多表联查——经典50题
  12. 新版源支付V5.18三端全套版+去授权/云端监控/免挂
  13. SeekBarVolumizer.java
  14. vba遍历字符串_Notes-VBA-遍历
  15. H-ui.admin v3.1多图片预览上传的问题解决
  16. 浅谈MES的通用设计之一:数据传输
  17. 大数据系列——什么是hive?hive用来干什么的?hive常见问题是啥?
  18. 当你PMP证书到期后,续证的方法有哪些?
  19. java与barTender交互,C# 调用BarTender模板 打印
  20. 拟牛顿法及其matlab实现

热门文章

  1. AirServer专业的投屏软件 支持安卓、苹果手机投屏至电脑
  2. 电脑软件:UPDF - 高效率高颜值的PDF编辑器
  3. MATLAB中关于函数intlinprog的使用
  4. 获取当前局域网下所有连接设备的ip地址和mac地址
  5. 3D立体相册模板(大小可更改)
  6. 汕大计算机科学与技术学院,汕头大学都有什么系?
  7. childNodes和children,firstChild和firstElementChild,lastChild和lastElementChild的区别
  8. 墨菲定律、二八法则、马太效应、彼得原理、酒与污水定律、水桶定律、蘑菇管理原理等13条是左右人生的金科玉律。...
  9. redis配置类+redis工具类
  10. Python练手项目:玩转三阶魔方