- 浏览: 14113 次
最新评论
一些有用的Web或者手机UI设计工具
- 博客分类:
- 技术杂绘
http://www.webjx.com/webmanage/experience-27081.ht ml Webjx.Com提示:最全面的"UI设计与线框图"工具软件.
勾勒出一个网站、软件或者其他产品的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的使用者来说,这是个测试版,所以可能存在没有风格化的元素。
一套非常有用的广告模板
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硬件产品以及一些网络设施的模板图。非常适合于制作物理图表。
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 一篇全面介绍线框设计扮演了如何重要的角色。 随着web设计下一个十年的到来,重新评价和理解线框图的时候到来了,一个经得起用户体验的产品。
线框设计是一种不可或缺的设计思想,一个数字的草图,随时可以修改擦除或者恢复。 Paul Boag是一个线框设计迷,坚信线框设计是设计进程中不可缺少的部分。他在设计中坚持五个牢不可破的规则。 项目开发过程中可能最大的错误就是没有定制计划,这篇文章讨论其原因。
Resources and Round-Ups 一个tumblog专注于线框,原型,实物设计。 在这个网站可以查看一些基于线框设计的网站,可分析学习设计人员是如何将实体模型转化为设计的。因为线框和设计都是由设计者自己上传的,每个线框设计都包含了一个简短的说明。大部分的网站原来是数字实物模型,有容易修改和重新设计的优势。起结果是令人愉快的线框设计。
一些互动设计的原则和模式 这篇文章关注一些线框工具和独立的应用程序,包括一些你可以用来制作自己线框图的一些工具:线框工具集,浏览器窗口,表单元素,网格,Mac OS X元素和手机元素,你可以在任何图形编辑器中使用他们,PS,AI,甚至纸笔工具。 20个资源,用于应用程序开发的草图阶段。 这些可打印的草图模板都是特意为web设计人员设计的。附加有浏览器的版本说明(Safari,Chrome甚至Firefox) 当你可以使用一个预制指南来节省时间,更好的发挥你的创造力,为什么还要从头开始设计呢?在这篇文章中,你将得到很多很棒的免费工具,一个笔记集合以及一些要购买的产品来帮助你线下设计。
源地址: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
发表评论
-
字符串操作辅助类
2012-07-06 09:52 877**//// /// 字符串操作辅助类 /// ... -
如何用 Eclipse 调试 Perl 应用程序
2012-07-06 09:45 595本教程将介绍 Eclipse 的 EPIC 插件提供的调试 ... -
正则表达式例子
2012-07-06 09:37 704正则表达式例子1 reg: (\"\w. ... -
加载系统皮肤
2012-07-06 09:30 674//支持皮肤需要这两个头文件 container里面加 ... -
PHP+Ajax+Oracle分页查询
2012-07-05 20:45 831一:页面文件(test.php) ... -
使用Jmesa分页组件在jsp里总的页数totalRows
2012-07-03 13:44 1006问题描述: 关 ... -
关于FLEX 里控件宽度的一个问题
2012-07-02 12:26 948BorrowsO ... -
JavaScript、Flex、Air之间的相互通信的研究
2012-07-02 12:26 518大家都知道在Air中嵌入的HTML控件中打开一个新的浏览器 ... -
flex中自定义事件--------利用元数据标签
2012-07-02 12:26 556使用 标签在 MXML 文件中插入元数据标签。元数据标签 ... -
flex学习-----自定义Sprite
2012-07-02 12:25 668package com.cvicse.workflow.u ... -
Flex的通信方式(一)――Webservice-1
2012-07-02 12:25 532flex与Webservices与简单通信 1、格 ... -
写一篇上个月想写的文章
2012-07-01 09:59 639一直以来就想写这 ... -
这一切都是命, 我才24呢??
2012-07-01 09:59 630html, css, Flex, PS, FW, winf ... -
免费IT教程视频
2012-07-01 09:59 6各位,这是我整理 ... -
用SpringGraph制作拓扑图和关系图
2012-07-01 09:59 1016SpringGraph是Adobe的Flex 2.0的开源 ... -
flex 第三方库 大全
2012-06-30 16:25 758flex 第三方库 大全 2011年11月17日 下面总 ... -
Flash与Flex路在何方?
2012-06-30 16:25 602Flash与Flex路在何方? 2011 ... -
Flex 初接触
2012-06-30 16:25 592Flex 初接触 2010年06月19日 Flex 是A ... -
flex css( 转)
2012-06-30 16:25 563flex css( 转) 2011年05月23日 Dan ... -
Flex和Actionscript开发Flash游戏1
2012-06-30 16:25 472Flex和Actionscript开发Flash游戏1 20 ...
相关推荐
一个有用的工具,用于实时监视性能并对Nginx Web服务器上运行的应用程序进行故障排除。 项目设计概述 Nginx日志工具包含三个组件: :在运行Nginx实例的系统上安装此软件包,以跟踪指标和元数据。 :Web UI,用于...
是由整理并维护的web相关工具网站集合。如果收录有误,可以通过反馈给我 说明:收录来源有、 内容 图片类 | (压缩图片) (生成好看的渐变背景图) (阿里巴巴矢量图标库) (好看的壁纸) (批量编辑图片的所有工具。包括...
一组有用的 React.js UI 套件和组件库。 (来自他们回购的描述) -- 官方 Semantic-UI-React 集成。 —— :evergreen_tree: Evergreen React UI 框架(按细分) -- 官方 Atlassian 组件库。 -- 使用 React 构建可...
原始UI 与Sass一起构建的前端设计工具包,用于开发响应式Web应用程序。 Primitive还为默认HTML元素(按钮,表单,表格,列表和排版)提供了有用的,与浏览器一致的样式。安装CSS快速入门(简单) 或使用CDN URL: : ...
Sketch正在迅速取代Photoshop,用于从低保真线框到高保真模型和设计图标的所有的UI设计任务。Sketchapp是一个专为web和移动设计人员制作的Mac应用程序。它的功能,灵活性和速度满足了你对于一个轻量级,易于使用的...
用于UI驱动的开发的工作台:开发人员和设计人员用于构建和记录网站和应用程序的工具。 如果您想...很有用 创建一个生活模式库 记录您的设计系统 使用您的应用程序组件和模板进行原型制作 使用代码作为单一事实来源 ...
IxEdit是用于Web的基于JavaScript的交互设计工具。 使用IxEdit,设计人员可以练习DOM脚本,而无需编写代码来动态更改,添加,移动或转换网页上的元素。 尤其是,在Web应用程序的原型设计阶段中,IxEdit必须非常有用...
CSS3 是对 CSS 规范的一个很大的改善和增强,它使得 Web 开发人员可以很容易的在网站中加入时尚的效果。尽管如此,有几个工具可以在你使用 CSS3 制作网站的时候起...在这篇文章中,收集了10款非常有用的工具推荐给大家
:thumbs_up: 选定的质量资源列表以及用于现代Web开发的有用链接。 :smiling_face_with_smiling_eyes: 随意贡献自己的有用链接! 分析工具 设计灵感 设计 Git / GitHub JavaScript 工程脚手架 Vue.js CSS / UI框架...
在这里,我将分享您完成Web开发工作和提高工作...网页设计工具 :Figma是用于网页设计的非常有用的工具。 许多UI / UX设计师都使用它,这是我的最佳选择。 :另一个出色的网页设计工具。 :(免费和付费)Adobe XD是另
爬虫(Web Crawler)是一种自动化程序,用于从互联网上收集信息。其主要功能是访问网页、提取数据并存储,以便后续分析或展示。爬虫通常由搜索引擎、数据挖掘工具、监测系统等应用于网络数据抓取的场景。 爬虫的...
还有一些与课堂项目相关的代码片段,这些片段对于从您自己的项目中学习还是对您自己的项目很有用。 随意参考,共享,在自己的班级中使用,建议更改等。 代码段,示例和演示 入门HTML模板: code-snippets/project-...
爬虫使用requests+beautifulsoup4+gevent,深度学习模型使用TensoFlow 2.0,WEB服务使用Vue.js+Element UI。 爬虫(Web Crawler)是一种自动化程序,用于从互联网上收集信息。其主要功能是访问网页、提取数据并存储...
爬虫(Web Crawler)是一种自动化程序,用于从互联网上收集信息。其主要功能是访问网页、提取数据并存储,以便后续分析或展示。爬虫通常由搜索引擎、数据挖掘工具、监测系统等应用于网络数据抓取的场景。 爬虫的...
提供了许多有用的工具,如:缓存,事物处理,验证,异常处理,日志,Linq DataContext工厂,Restful web service等. 3. 系统架构 基于.NET Framework 3.5 SP1,并且使用的目前最新的技术开发。 全面支持SAAS ...
Flutter是Google的可移植UI工具包,用于通过单个代码库为移动,Web和桌面构建漂亮的,本机编译的应用程序。 极简设计 干净且结构化的代码 可重复使用的组件 观看视频 下载Android APK 支持我 如果这是模板对您有用...
在企业环境中,在人力资源的乡亲需要是能够创建组织结构图,一些商业演示,也许一些方向性图和建筑平面图,引导游客通过设施。但是,在同一个公司,程序员和工程师也需要软件,可以让他们建立UML图,工作流程,程序...
采用SQLite数据库把所有数据保存到了本地, 我自己也有虚拟主机, 本来想顺便公布一套WEB API实现真正的云笔记, 但是现在的客户端设计怕是要经过大改才能实现, 这个想到就头痛. 5. 历史版本功能本来是可以继续做下去...
FaisoilAhamadamadi_2_09042020将模型转换为网站场景最后,您已经找到了自己的第一份实习职位,当时是在Reservia(一家提供度假计划工具的小公司)的Web开发人员。 他们的网站使用户可以在他们选择的城市中找到住宿...