规划和沟通是任何成功的网站或应用程序的开发两个关键要素。和正是线框过程提供了一个快速和简单的方式来规划布局和具有成本效益,节省时间的工具,轻松地沟通你的想法给别人。线框通常有一个网页页眉,页脚,侧边栏,甚至可能产生的一些内容,它给你,你的客户和同事们一个简单的可视化的布局,说明网站的结构年底将基本要素:该项目和服务作为今后任何改动的基础。
本文侧重于实际线框工具和独立应用程序,以及资源,你需要建立你自己的线框,线框套件,浏览器窗口,表单元素,电网,Mac OS X的元素,移动元素,你会使用在任何典型的图形编辑器,如Photoshop或Illustrator。或者你可以使用笔和纸。
[ 注意:你已经预先订购我们的印刷复制粉碎书#3?这本书是关于如何重新设计网站的专业指导,还引入了一个全新的观念,逐步网页设计专家为你写的。]
完成线框工具箱
表单元素quommunnication模板套件,RSS订阅图标,颜色,广告的单位,浏览器窗口和网格:素描和线框常见的设计元素PSD文件。
Mac OS X界面模板套件
Leopardy接口模板套件。这个表的广泛使用,为最大的灵活性,同时保持像素的精度。
Facebook的应用程序模板套件
的Facebook相关的元素的一个相当可观的收集,使用Facebook应用程序中创建线框。
Flex的模板套件
包括从所有Flex组件的Flex 3样式指南:面板,数据网格,按钮,字段,链接,切换,菜单,滚动条,手风琴,标签,列表,数据采集器,工具提示,错误。
Eclipse的模板套件
此模板使您可以轻松的原型与OmniGraffle(TM)的Eclipse(向导)对话框。
大量的Web用户界面和按钮设置
这一套包含UI元素,在三种不同的风格:光面,缎/光线梯度,和一个颜色。缎/光梯度集是在7不同的颜色(其中你会发现所有PSD文件)。可用的控制按钮,包括箭头和基本符号,信息和文本框,breadcrubs,按钮,和其他导航元素,下拉和可折叠框样式,讲话气泡,搜索形式和加载元素。
雅虎模具设计-设计模式库
你将很难找到比这更好的线框资源。雅虎设计模板套件可用于几乎所有的应用程序:OmniGraffle时,Visio(XML)的Adobe Illustrator(PDF和SVG)和Adobe Photoshop。这个巨大的图书馆,包括下列内容(基本上都):广告的单位,挂历,旋转木马,图表和表格,UI控件,表单元素,网格,菜单和按钮,移动(一般),手机(iPhone),导航和分页, OS元素,占位符文本,屏幕分辨率,标签,窗口和容器。
免费素描及线框套件
素描线框工具包是免费的素描和线框元素集。它包括表单元素,图标,指标,反馈信息,工具提示,导航元素,图像占位符,嵌入式视频,滑块和常见的广告横幅。该套件有两个矢量格式,Adobe Illustrator和其他SVG中,可以很容易地修改。它也可以在PDF和EPS格式下载。
EightShapes的统一性
EightShapes“统一是收集模板,图书馆和其他资产,使用户体验设计师更快地创建更一致和更有效的交付。该系统采用的Adobe Creative Suite产品; Adobe InDesign中是主要的创作工具。
线框符号
此下载包含一个的线框符号库和一个完整的Adobe Illustrator文件与散布在电路板上的所有元素。安装的库只需拖放命名的文件到您的Adobe Illustrator的“符号”目录线框Symbols.ai。一旦你打开Illustrator中,到您的符号调色板和加载库。
OmniGraffle线框 模具,
这是一套OmniGraffle 5.x版本(Mac OS X中)线框的形状。
OmniGraffle UX的模板,
这是临OmniGraffle为模板界面设计,包括基本UX的文件需要共享层;如标题页,线框,故事。
网页元素
使用开源Bitstream的Vera“字体集”和FamFamFam免费的图标,你应该有你常见的网页元素最覆盖,包括标题,表单元素,内容管理功能,图像占位符,等等。
Web浏览器模板
在1024×768和800×600像素大小的Photoshop浏览器模板-网页设计工具包的Photoshop这些浏览器模板,涵盖几乎所有的浏览器(Firefox,IE,Safari浏览器,卡米诺,甚至网景公司)。无论大小,安全的可视面积明确标示在一个单独的层。
这些Photoshop的IE浏览器,Mac和Windows的Firefox的火狐浏览器模板浏览器模板的网站已被嘲笑以下尺寸:800×600,1024×768和1280×1024像素。
Photoshop的浏览器模板
分层PSD文件包含三个不同的浏览器的决议;轻松编辑职称,地址栏,滚动条和Favicons的。刚刚打开PSD,并放置在顶部的设计层,你的工作,瞧!
浏览器屏幕和网站内容的
一个载体的网站资产的有用。
为PHOTOSHOP的WEB安全区模板
所有的网络安全区下面列出的浏览器的PSD模板可以单独下载选择从以下决议:640×480,800×600,1024×768,1280×960和1600×1200像素。
Windows Vista中IE浏览器的Web安全区
Windows Vista的Firefox的Web安全区
Windows XP的IE Web安全区
Mac OS X的Safari网络安全区
Mac OS X的Firefox网络安全区
Mac OS X的Safari网络安全区
Web窗体元素
最佳实践UX的表格模板,
这是一个模板套件的遵循UX表单设计的最佳实践的全面释放。它的铺设形式提供了三种不同的方式,每个都有自己的利益。此版本还提供了不同的按钮布局,进度指示器,CAPTCHA码输入字段,标签和更多。
Photoshop中的表格元素模板,
这些Photoshop文件,包括所有常见的形式元素的截图显示您所选的操作系统(苹果经典的Mac OS X,WIN XP和WIN经典)。表单元素被分离成单独的层,使您可以轻松地选择,调整或切换他们请你。
浏览器表单元素PSD的
这个PSD文件中包含的Mac Firefox 3和Vista的IE7中的另一个表单元素。
Web表单元素的第1卷
第1卷包含一个Web用户在Photoshop格式的表格interace元素的选择。
Web窗体元素第二集
这是Web窗体用户界面元素第2卷上述已在不同的风格设计。
Photoshop的按钮模板,
这些Photoshop按钮模板已成单个层的分离,很容易可选。你可以选择从以下颜色:深蓝,浅蓝,深绿,浅绿,黄色,橙色,红色和紫色。
WEB浏览器元件
您可以选择您需要从操作系统和浏览器使用的元素,他们单独和下载。
Windows Vista中IE浏览器表单元素
Windows Vista的Firefox的表单元素
Windows XP的IE浏览器表单元素
Windows XP的Firefox的表单元素
Mac OS X的Firefox的表单元素
Mac OS X的Safari的表单元素
网格模板
960px Photoshop的网格模板
此模板具有水洗出来的颜色层为一个三列的20像素的排水沟设计指南,三分治的目的,以形象化的两列。此外,它被分解成6列20像素的排水沟。
960 OmniGraffle网格模板
Illustrator的蓝图CSS模板COMPS
Adobe Illustrator的文件具有24列格一个CSS框架,如蓝图。它包括遵守蓝图的24列30个像素,10像素宽的水沟和水平宽度950像素的网格的指南。水平的指南,提供18个像素或12像素的基础字体行高1.5 EM。
Photoshop文档具有24列格一个CSS框架,如蓝图,蓝图的CSS模板的Photoshop谱曲。它包括遵守蓝图的24列30个像素,10像素宽的水沟和水平宽度950像素的网格的指南。水平的指南,提供18个像素或12像素的基础字体行高1.5 EM。
移动应用开发资源
iPad的GUI PSD
PSD的使用载体,所以它是完全可编辑和可扩展性。你会发现有一些新的UI相比iPhone界面的元素。可行的屏幕设计格式768×1024,所以任何你的Photoshop文件中的设计可以很容易被带过来的SDK。
最终的iPhone模板- Graffletopia
这Omnigraffe iPhone的模板套件包含的背景,标题栏,按钮,选择和所有其他iPhone UI元素。它可以很容易地调整大小取消组合,调整中间元素水平,然后重新组合成一个单一的按钮元素。
iPhone 3G的模板
包括了iPhone 3G的标准接口组件:按钮,字段,地图元素,键盘,图标。所有的组件都是一个透明的背景上,并应重新大小很好。
iPhone的GUI PSD 3.0
与苹果公司正式发布新的iPhone 3.0来了一个新的GUI元素的数量。的修改和补充,有些已经在这个界面包括:地图和地图元素包括卷曲,复制和粘贴元素;时间表栏编辑器;和水平的iPhone和水平面板的酒吧和键盘。
iPhone PSD矢量工具外,
iPhone的入门工具包带有几个按钮元素,以及六种不同的iPhone界面选项。
iPhone GUI元素
作为分层的Photoshop(PSD)文件提供的免费iPhone元素。
iPhone的图形用户界面作为丰富的烟花符号
本iPhone套件已经设计使用Adobe烟花。它也有一些代码行,以丰富的符号转化成简单的向量符号与一些变量,它有几种组合,按钮,背景等。
谷歌Android GUI应用样机PSD的
Photoshop文件包含所有的Android 1.5,谷歌的移动操作系统的基本要素。
Palm Pre的GUI PSD
此Palm Pre的GUI PSD的已建成以方便编辑和缩放向量,它包含了最前的GUI元素。
RIM黑莓PSD的
下载包中包含详细的黑莓应用程序开发135层。
可选的线框附加
草图交互符号,
这个符号背后的总体思路是:在一个明确的和快速的方式可视化用户界面状态以及用户操作的愿望。
Storyboard的特征(通过谷歌浏览器)
校对商标
标准的Web横幅,
您可以下载这些标准的Web横幅广告或单独(468×60像素,768×60 125×125等)。也有共同但有非标准的旗帜大小的模板(120×30 230×33 728×210等)。
线框图标,免版税的EPS和PNG
图标集,包括EPS和原Konigi线框图标集PNG版本都适合使用,如Adobe Illustrator的矢量绘图应用程序以及在Microsoft Visio。
WEB UI宝箱
这PSD分层文件,大多数的文件是完全可编辑,包含超过100个网站的设计元素。
webdesigner套件
这Photoshop下载包含注册字段,菜单,复选框,单选按钮和游标。
打印素描纸
A4和A3的素描电网
下载和打印纸本960像素宽的网格可以很容易地创建一个三列(320像素),四列(240像素),五0column(192像素)或六列( 160像素)电网的单张纸。你有两种尺寸可供选择,A4和A3。
印刷和素描线框模板
iPhone应用素描模板
本素描纸的方格等于10像素。刻度显示状态栏,导航栏,键盘,标签栏和工具栏的高度。为达到最佳效果,无国界在A4纸打印。
iPhone为素描的线框模板
两个布局,无论是在PDF和Visio(VSD)的格式,以便快速的iPhone样机。
iPhone APP线框的模板
有两个版本可供选择,在风景和肖像之一。每个版本都包含三个页面:第1页,有一个垂直的屏幕和笔记列,第2页有横屏和票据列第3页有三个屏幕的布局,是伟大的起草设计。
打印线框和注释
低于8.5×11英寸绘图纸是由视觉设计师,交互设计师和信息架构师。线框图上的2×2方格的用户界面,故事板的相互作用和绘图值,你会发现风格。另外,你会得到一个网站地图或其他任何东西,来了起草的基本格。从以下选择:
与说明
这线框网格分为24列,每列之间的排水沟,线框。网格是如蓝图的CSS框架内工作的设计师特别有用。
线框(山水)
线框(人像)
故事情节,
这是一个具有四个单元的故事情节。每个单元都包含一个简单的网格。
与Notes的故事情节,
这是一个具有四个单元的故事情节。每个单元都包含一个简单的网格。每个单元下方的面积被裁定票据。
纸张的基本,
这是一个基本的格框。使用概念图,网站地图,谱,表和其他任何你绘制。
线框磁铁(DIY套件)
这些DIY的磁铁模板的基础上,Konigi线框模具,包括3张那将是有用白板原型的元素。只需下载和到磁铁张打印PDF文件,并把它们剪下来。
表单元素
标签,按钮和酒吧
窗口和对话框
更多的资源和一些线框的启示
web.without.words
一个视觉设计师采取流行的网站和重建线框的操场。
graffletopia
Graffletopia是一个巨大的资源,为OmniGraffle(苹果只),可悲的是免费的模具。与OmniGraffle,您可以快速创建高品质的线框图,流程图和其他图表。
去
样机去的样机是一个随时可以使用的UI组件和设计模式,建成使用Balsamiq样机的用户贡献的集合。您可以下载所有的组件和设计模式,在您的样机使用。
线框杂志
线框杂志致力于向所有的东西线框和原型。它有一个巨大的图书馆下载的模板,样本和UI工具,甚至部分的灵感。
我{心脏}线框
我{心脏}线框是一个线框的灵感和资源的重要来源。是的,我们都爱线框!
进一步的相关文章
该站点不少好素材,所以直接google翻译,以备下次使用。
分享到:
相关推荐
设计网页线框图是网站成功的关键步骤,通过有效的工具和方法,设计师可以更好地规划和实现用户友好的界面。选择适合的线框图设计工具,如上述10款推荐,能够极大地提升设计效率和质量,从而为用户提供更优质的产品...
用户界面设计与开发是构建软件或应用程序不可或缺的一部分,它直接影响到用户的使用体验和产品的市场竞争力。这份"用户界面设计与开发精解DOC手打版"文档涵盖了这一领域的关键知识点,旨在帮助设计师和开发者深入...
文件列表中的"说明.txt"可能包含教程的详细步骤和技巧,"爱书吧-2万本图书免费下载.url"可能是推荐的其他设计资源链接,而"网页界面设计艺术教程"可能是主教程文件,可能包含了案例分析、实战练习和设计资源。...
它们是产品设计的核心,为产品经理、设计师和开发团队提供了清晰的视觉指南,帮助构建和理解应用的用户体验(UX)和用户界面(UI)。本资源包含的"4套线APP设计原型线框图"是一个宝藏库,适用于那些在任何时间、任何...
User Interface Design Framework 是一个免费提供网页设计师使用的用户界面设计工具。Pattern Tap 是一个可以寻找一些设计资源与模式等的网站。User Interface Design Patterns 提供了一些热门的用户 UI 界面设计...
【SSD4用户界面设计考试源代码】是一个与软件开发相关的主题,主要集中在用户界面(UI)设计上,这是软件工程中的一个重要环节。用户界面设计是构建任何应用程序或系统的关键部分,因为它直接影响到用户的交互体验和...
10. **User Interface Design Framework**: 这是一个免费的网页设计师资源库,提供用户界面设计模板和框架,便于设计师快速启动项目。 11. **Pattern Tap**: Pattern Tap提供了一系列设计资源和模式,帮助设计师...
参考材料列举了在设计过程中参考或借鉴的各种资源,可能包括先前的用户研究、设计模式、最佳实践、行业标准以及相关的设计工具和软件。 1.4 术语表 术语表提供了设计文档中使用的专业术语和缩写的定义,以确保所有...
在IT行业中,UI界面设计是...通过掌握这些UI界面设计工具和相关知识,设计师可以创造出既美观又实用的用户界面,提升产品的整体价值。在实际工作中,设计师还需要不断学习新的工具和技术,以适应快速发展的数字世界。
总结,动态网页设计涉及众多环节,从需求理解到技术实现,再到工具选择和后期维护,每一步都需要细致入微的关注。掌握这些知识点,你将能够有效地设计出富有活力和互动性的网页。通过学习和实践,你将在网页设计的...
在UI设计和原型制作过程中,"5s线框模型PSD"是一个重要的工具,它能够帮助设计师快速构建和测试交互界面的设计概念。5s线框模型主要指的是针对苹果iPhone 5S设备尺寸和屏幕比例的设计模板,使得设计作品在真实设备上...
Photoshop 是一款强大的图像处理软件,也常被用于制作网页设计的线框图。线框图是设计过程中的重要步骤,它能清晰地展现网页结构和功能,方便设计师与开发人员沟通,以及获取用户反馈。本文将详细介绍如何利用Photo...
线框图是产品设计的初步阶段,它以简洁、低精度的形式描绘了产品的界面布局和关键交互。Axure提供了丰富的线框图部件库,包括各种常见的UI元素,如按钮、文本框、下拉菜单、图片、表单组件等。这些部件不仅便于拖放...
在这个案例中,界面UI的概要设计可能以Visio文件的形式呈现,设计师可能会利用Visio的图形和布局功能来构思和规划用户界面的初步设计。 UI设计的核心概念包括以下几个方面: 1. **用户体验**(User Experience, UX...
提供了大量用于网页设计的PSD分层文件,覆盖了网页设计所需的各种元素,便于设计师快速搭建网页原型。 **网址**:http://bestblogbox.com/freebies/all-in-one-web-elements-kit/ #### iPadGUISet 为iPad应用...
UG NX3作为三维设计的旗舰产品,提供了全面的设计工具,包括实体建模、曲面建模和线框建模。其用户界面友好,支持定制,可以根据个人工作习惯进行调整,提高工作效率。此外,UG NX3还包含了强大的装配管理功能,可以...
在UI资源界面设计中,我们主要关注的是用户界面(User Interface)的设计,这涵盖了网页和手机应用的视觉元素和交互方式。UI设计的核心是为用户提供直观、美观且易用的界面,提升用户体验。在这个主题下,我们可以深入...
在网页设计领域,线框图是设计流程中的重要环节,它为设计师提供了一个清晰、简洁的方式来描绘页面结构和用户交互。Method Wireframe Kit,作为一款专门用于创建网页设计线框图的Sketch素材,为设计师们提供了丰富的...
【界面设计工具】是设计师们用来创建用户界面的专业软件,它们提供了一系列强大的功能,使得设计者可以高效地构思、绘制并实现各种类型的界面,包括但不限于应用程序界面、网站、移动应用、游戏界面等。这些工具通常...