40个重要的用户界面UI设计工具
openkk 12年前
<h2><a href="/misc/goto?guid=4958343257212259762" target="_blank">Android Asset Studio</a></h2> <p>The launcher icon generator will create icons that you can use in your Android application, <ins></ins></p> <p><a><img class="aligncenter size-full wp-image-8225" title="1" alt="" src="https://simg.open-open.com/show/a56b940be3e853db0180405271c37baf.jpg" width="552" height="349" /></a></p> <h2> <a href="/misc/goto?guid=4958343258102524022">iPhone</a> Mockup</h2> <p><a href="/misc/goto?guid=4958343258102524022">iPhone</a> Mockup lets you create user interface for an <a href="/misc/goto?guid=4958343258102524022">iPhone</a> app in a drag and drop system.</p> <p><a href="https://simg.open-open.com/show/0d43658d49dc9c5876afd9f6d8952d0d.jpg"><img class="aligncenter size-full wp-image-8226" title="2" alt="" src="https://simg.open-open.com/show/0d43658d49dc9c5876afd9f6d8952d0d.jpg" width="552" height="297" /></a></p> <h2><a href="/misc/goto?guid=4958343260384394032" target="_blank">Fillerati</a></h2> <p>A unique alternative to Lorem Ipsum. Generate blocks of real text for your mockup. <ins></ins></p> <p><a href="https://simg.open-open.com/show/bd4127ef5c7ccbe629e763ef9e36fc66.jpg"><img class="aligncenter size-full wp-image-8230" title="3" alt="" src="https://simg.open-open.com/show/bd4127ef5c7ccbe629e763ef9e36fc66.jpg" width="552" height="308" /></a></p> <h2><a href="/misc/goto?guid=4958343261415090313" target="_blank">非死book Applications</a></h2> <p>A very sizable collection of 非死book related ingredients to be able to incorporate with regard to creating wireframes for 非死book applications.</p> <p><a href="https://simg.open-open.com/show/f3ec4251984352091bef2c4a653514f3.jpg"><img class="aligncenter size-full wp-image-8231" title="4" alt="" src="https://simg.open-open.com/show/f3ec4251984352091bef2c4a653514f3.jpg" width="552" height="378" /></a></p> <h2><a href="/misc/goto?guid=4958343262261994690" target="_blank">ForeUI</a></h2> <p>ForeUI typically is a easy-to-use UI prototyping tool, tailored in order to create mockup / wireframe / prototypes for any application or internet site you may have with regard to mind. <ins></ins></p> <p><a href="https://simg.open-open.com/show/3b736a140178931998f4f086ba9d28af.jpg"><img class="aligncenter size-full wp-image-8232" title="5" alt="" src="https://simg.open-open.com/show/3b736a140178931998f4f086ba9d28af.jpg" width="552" height="294" /></a></p> <h2><a href="/misc/goto?guid=4958332231788927000" target="_blank">User Interface </a><a href="/misc/goto?guid=4958343263815465165">Design</a> Framework</h2> <p>A free Interface <a href="/misc/goto?guid=4958343263815465165">Design</a> tool for Web Developers.</p> <p><a href="https://simg.open-open.com/show/3521809cbaa65a54807b829996e85c6c.jpg"><img class="aligncenter size-full wp-image-8233" title="6" alt="" src="https://simg.open-open.com/show/3521809cbaa65a54807b829996e85c6c.jpg" width="552" height="282" /></a></p> <h2><a href="/misc/goto?guid=4958343265360489006" target="_blank">Napkee</a></h2> <p>Napkee lets you export Balsamiq Mockups to <a href="/misc/goto?guid=4958343266159211350">HTML</a>/<a href="/misc/goto?guid=4958343266159211350">CSS</a>/JS and in addition Adobe Flex 3 at a click of a button. <ins></ins></p> <h2><a href="https://simg.open-open.com/show/439018db64a796db64fe44262ef47357.jpg"><img class="aligncenter size-full wp-image-8234" title="7" alt="" src="https://simg.open-open.com/show/439018db64a796db64fe44262ef47357.jpg" width="552" height="308" /></a></h2> <h2><a href="/misc/goto?guid=4958343267712149548" target="_blank">DIY Kit</a></h2> <p>This DIY magnet template is actually based found on the Konigi wireframe stencils and even consists of 3 sheets of ingredients which may be practical within whiteboard prototyping.</p> <p><a href="https://simg.open-open.com/show/2c32458d83344a827222093e82787295.jpg"><img class="aligncenter size-full wp-image-8235" title="8" alt="" src="https://simg.open-open.com/show/2c32458d83344a827222093e82787295.jpg" width="552" height="336" /></a></p> <h2><a href="/misc/goto?guid=4958343268514200768" target="_blank">Flex 3 Stencil</a></h2> <p>Consists of all Flex components from Flex 3 Style Guide: panels, information grid, buttons, areas, hyperlinks, toggle, menu, scrolls, accordion, tabs, list, data picker, tool tip, errors and others.</p> <p><a href="https://simg.open-open.com/show/db032c9446a27f7e7a2335cfbc720c2e.jpg"><img class="aligncenter size-full wp-image-8236" title="9" alt="" src="https://simg.open-open.com/show/db032c9446a27f7e7a2335cfbc720c2e.jpg" width="552" height="376" /></a></p> <h2><a href="/misc/goto?guid=4958188078629748017" target="_blank">Gliffy</a></h2> <p>Gliffy complimentary wireframe software makes it effortless that would create web pages wireframes as well as to be able to share internet mockups with anyone.</p> <p><a href="https://simg.open-open.com/show/9c92afb5c2453bedd984061407637322.jpg"><img class="aligncenter size-full wp-image-8237" title="10" alt="" src="https://simg.open-open.com/show/9c92afb5c2453bedd984061407637322.jpg" width="552" height="371" /></a></p> <h2><a href="/misc/goto?guid=4958343270076270930" target="_blank">LivePipe UI</a></h2> <p>LivePipe UI typically is a suite of excellent quality widgets not to mention controls for internet 2.0 applications built using.</p> <p><a href="https://simg.open-open.com/show/d51654dbeb792b1d15f04610f1edc8d4.jpg"><img class="aligncenter size-full wp-image-8238" title="11" alt="" src="https://simg.open-open.com/show/d51654dbeb792b1d15f04610f1edc8d4.jpg" width="552" height="359" /></a></p> <h2><a href="/misc/goto?guid=4958203108428709757" target="_blank">Mobility </a><a href="/misc/goto?guid=4958343271619722585">design</a>-inspiration/”>UI <a href=">design</A>-inspiration/”>UI <A href=">design</a>-inspiration/”>UI <a href="/misc/goto?guid=4958343263815465165">Design</a> Elements</h2> <p>A free set of <a href="/misc/goto?guid=4958343271619722585">design</a>-inspiration/”>UI <a href=">design</A>-inspiration/”>UI <A href=">design</a>-inspiration/”>UI <a href="/misc/goto?guid=4958343263815465165">design</a> elements. <ins></ins></p> <p><a href="https://simg.open-open.com/show/f0acedf033016f205c50a3cd362a7fd2.jpg"><img class="aligncenter size-full wp-image-8239" title="12" alt="" src="https://simg.open-open.com/show/f0acedf033016f205c50a3cd362a7fd2.jpg" width="552" height="677" /></a></p> <h2><a href="/misc/goto?guid=4958203116539609536" target="_blank">Massive Web UI and Button Set</a></h2> <p>This set contains the next elements with regard to three unique styles: glossy, satin/light gradient, and one-color. The satin/light gradient set typically is obtainable in 7 different colors, all many of these at absolutely no cost. <ins></ins></p> <p><a href="https://simg.open-open.com/show/f2d2caca74669849e53d584f1ed8fdb6.jpg"><img class="aligncenter size-full wp-image-8240" title="13" alt="" src="https://simg.open-open.com/show/f2d2caca74669849e53d584f1ed8fdb6.jpg" width="552" height="284" /></a></p> <h2><a href="/misc/goto?guid=4958343276928554520" target="_blank">jQTouch</a></h2> <p>A <a href="/misc/goto?guid=4958343277728453199">jQuery</a> plugin for mobile <a href="/misc/goto?guid=4958343258102524022">iPhone</a> application development.</p> <p><a href="https://simg.open-open.com/show/92136d2b0c41fedbb8f24001aee1f95e.jpg"><img class="aligncenter size-full wp-image-8241" title="14" alt="" src="https://simg.open-open.com/show/92136d2b0c41fedbb8f24001aee1f95e.jpg" width="552" height="323" /></a></p> <h2><a href="/misc/goto?guid=4958343279263441945" target="_blank">Patternry</a></h2> <p>Patternry is actually an interface shape pattern collection aimed to help resolve typical interface shape difficulties.</p> <p><a href="https://simg.open-open.com/show/ab90341e70a9a37320709bb721a3e81e.jpg"><img class="aligncenter size-full wp-image-8242" title="15" alt="" src="https://simg.open-open.com/show/ab90341e70a9a37320709bb721a3e81e.jpg" width="552" height="293" /></a></p> <h2><a href="/misc/goto?guid=4958343280092037423" target="_blank">Small GUI Pack</a></h2> <p>Tiny Graphical Consumer Interface Elements Pack.</p> <p><a href="https://simg.open-open.com/show/b716aed4a76c353bd6dc6182362c7107.jpg"><img class="aligncenter size-full wp-image-8243" title="16" alt="" src="https://simg.open-open.com/show/b716aed4a76c353bd6dc6182362c7107.jpg" width="552" height="363" /></a></p> <h2><a href="/misc/goto?guid=4958343280893056808" target="_blank">Pattern Tap</a></h2> <p>Pattern Tap is at this site in order to satisfy and encourage the motivation requirements of user interface <a href="/misc/goto?guid=4958343263815465165">design</a> peers not to mention peeps. It aspires to be able to be the you eliminate pattern store for your own next inspiration really want.</p> <p><a href="https://simg.open-open.com/show/f8a09b5df813ca880550a0ee02be0b2c.jpg"><img class="aligncenter size-full wp-image-8244" title="17" alt="" src="https://simg.open-open.com/show/f8a09b5df813ca880550a0ee02be0b2c.jpg" width="552" height="268" /></a></p> <h2><a href="/misc/goto?guid=4958343282441070037" target="_blank">iPad GUI Set</a></h2> <p>Everything you may need for a iPad app layout throughout layered, vector PSD data. <ins></ins></p> <p><a href="https://simg.open-open.com/show/5bd0b9b0964b8c4e94ce4c4675f40b22.jpg"><img class="aligncenter size-full wp-image-8245" title="18" alt="" src="https://simg.open-open.com/show/5bd0b9b0964b8c4e94ce4c4675f40b22.jpg" width="552" height="342" /></a></p> <h2><a href="/misc/goto?guid=4958343283254264691" target="_blank">Fivesecondtest</a></h2> <p>Fivesecondtest assists anyone fine tune your own getting pages and calls to action by examining the actual most prominent ingredients of the <a href="/misc/goto?guid=4958343263815465165">design</a>. <ins></ins></p> <h2><a href="https://simg.open-open.com/show/3567fd6b6d6709a50e56fa58ecabe034.jpg"><img class="aligncenter size-full wp-image-8246" title="19" alt="" src="https://simg.open-open.com/show/3567fd6b6d6709a50e56fa58ecabe034.jpg" width="552" height="293" /></a></h2> <h2><a href="/misc/goto?guid=4958343284798767240" target="_blank">User Interface </a><a href="/misc/goto?guid=4958343263815465165">Design</a> Patterns</h2> <p>Interface Shape patterns usually are repeated solutions that resolve usual shape challenges. Shape patterns happen to be standard reference points for the particular experienced interface designer. <ins></ins></p> <h2><a href="https://simg.open-open.com/show/8588b45212d526657d9cb0a022ea40dd.jpg"><img class="aligncenter size-full wp-image-8247" title="20" alt="" src="https://simg.open-open.com/show/8588b45212d526657d9cb0a022ea40dd.jpg" width="552" height="316" /></a></h2> <h2><a href="/misc/goto?guid=4958343286338593186" target="_blank">MockFlow</a></h2> <p>MockFlow assists to be able to shape interactive UI mockups for Desktop Software, Deep Web Apps not to mention Websites. <ins></ins></p> <p><a href="https://simg.open-open.com/show/e3540340bbbaa7a684523b5881254711.jpg"><img class="aligncenter size-full wp-image-8248" title="21" alt="" src="https://simg.open-open.com/show/e3540340bbbaa7a684523b5881254711.jpg" width="552" height="322" /></a></p> <h2><a href="/misc/goto?guid=4958343287146180584" target="_blank">Android UI Elements Set</a></h2> <p>Free set of classic Android OS UI elements. <ins></ins></p> <p><a href="https://simg.open-open.com/show/3c54b139c63b41d233bbcdcd556e8bc6.jpg"><img class="aligncenter size-full wp-image-8249" title="22" alt="" src="https://simg.open-open.com/show/3c54b139c63b41d233bbcdcd556e8bc6.jpg" width="552" height="404" /></a></p> <h2><a href="/misc/goto?guid=4958323955136657823" target="_blank">The Pencil Project</a></h2> <p>The Pencil Venture s specific mission typically is in order to develop a free of charge not to mention opensource tool for creating diagrams and additionally GUI prototyping which all the people could certainly use.</p> <p><a href="https://simg.open-open.com/show/27ed24bf9368fc39f6f1fb309ff96465.jpg"><img class="aligncenter size-full wp-image-8250" title="23" alt="" src="https://simg.open-open.com/show/27ed24bf9368fc39f6f1fb309ff96465.jpg" width="552" height="385" /></a></p> <h2><a href="/misc/goto?guid=4958343288694091821" target="_blank">Mini Ajax</a></h2> <p>A collection of extremely elegant snippets. <ins></ins></p> <p><a href="https://simg.open-open.com/show/73e89d8b41b5dbce83ce56750356d443.jpg"><img class="aligncenter size-full wp-image-8251" title="24" alt="" src="https://simg.open-open.com/show/73e89d8b41b5dbce83ce56750356d443.jpg" width="552" height="338" /></a></p> <h2><a href="/misc/goto?guid=4958187529791468292" target="_blank">qTip2</a></h2> <p>A <a href="/misc/goto?guid=4958343277728453199">jQuery</a> upgrade for the particular qTip tooltip plugin. Conveniently make stylish tooltips for your website. <ins></ins></p> <p><a href="https://simg.open-open.com/show/0d1636e22363d07a2b09f0b3a7f05993.jpg"><img class="aligncenter size-full wp-image-8252" title="25" alt="" src="https://simg.open-open.com/show/0d1636e22363d07a2b09f0b3a7f05993.jpg" width="552" height="296" /></a></p> <h2><a href="/misc/goto?guid=4958323952743833718" target="_blank">Mockingbird</a></h2> <p>Mockingbird typically is a particular online tool which makes it convenient for a person to create, connect together, preview, and also share mockups of the web page or alternatively application. <ins></ins></p> <p><a href="https://simg.open-open.com/show/395aa27015dd1eeae6eb1cb9d9d99b91.jpg"><img class="aligncenter size-full wp-image-8253" title="26" alt="" src="https://simg.open-open.com/show/395aa27015dd1eeae6eb1cb9d9d99b91.jpg" width="552" height="294" /></a></p> <h2><a href="/misc/goto?guid=4958323954332241363" target="_blank">Hot Gloo</a></h2> <p>The actual Online Wireframe Application. <ins></ins></p> <p><a href="https://simg.open-open.com/show/3d658e49ab0f042acc4dade5102ca64d.jpg"><img class="aligncenter size-full wp-image-8254" title="27" alt="" src="https://simg.open-open.com/show/3d658e49ab0f042acc4dade5102ca64d.jpg" width="552" height="346" /></a></p> <h2><a href="/misc/goto?guid=4958343292476486458" target="_blank">iPlotz</a></h2> <p>iPlotz enables you to fast create clickable, navigable mockups as well as wireframes for prototyping websites and additionally software applications. <ins></ins></p> <p><a href="https://simg.open-open.com/show/3159cb0cc711dded8ad0548969d4251c.jpg"><img class="aligncenter size-full wp-image-8255" title="28" alt="" src="https://simg.open-open.com/show/3159cb0cc711dded8ad0548969d4251c.jpg" width="552" height="284" /></a></p> <h2><a href="/misc/goto?guid=4958343266159211350">HTML</a> Goodies</h2> <p><a href="/misc/goto?guid=4958343277728453199">Jquery</a> resource with great step-by-step documentation. <ins></ins></p> <p><a href="https://simg.open-open.com/show/0fa1182010e85d4e63aaa2bfe65c6456.jpg"><img class="aligncenter size-full wp-image-8256" title="29" alt="" src="https://simg.open-open.com/show/0fa1182010e85d4e63aaa2bfe65c6456.jpg" width="552" height="304" /></a></p> <h2><a href="/misc/goto?guid=4958343294770990312" target="_blank">Best Practice UX Forms Stencil</a></h2> <p>This types contain different switch designs, a progress signal, captcha code input field, labels then a lot more.</p> <p><a href="https://simg.open-open.com/show/fdb77684e46f33cbc7a4a2c05e7e8e4d.jpg"><img class="aligncenter size-full wp-image-8257" title="30" alt="" src="https://simg.open-open.com/show/fdb77684e46f33cbc7a4a2c05e7e8e4d.jpg" width="552" height="294" /></a></p> <h2><a href="/misc/goto?guid=4958343295585107648" target="_blank">Editable Grid</a></h2> <p>EditableGrid is actually a particular open source Javascript collection aimed at turning <a href="/misc/goto?guid=4958343266159211350">HTML</a> tables into advanced editable components. It centers on simplicity: just a limited lines of code are required in order to get your individual initial table up not to mention running. <ins></ins></p> <p><a href="https://simg.open-open.com/show/1b8ab8a8f244002b76a1ba6b38231c1a.jpg"><img class="aligncenter size-full wp-image-8258" title="31" alt="" src="https://simg.open-open.com/show/1b8ab8a8f244002b76a1ba6b38231c1a.jpg" width="552" height="319" /></a></p> <h2><a href="/misc/goto?guid=4958343297128737485" target="_blank">Mocklinkr</a></h2> <p>Make use of mocklinkr to be able to convey the static mockups as a linked-up not to mention clickable internet site that would impress a clients. <ins></ins></p> <p><a href="https://simg.open-open.com/show/325929069f5495d8bb1471511996dccc.jpg"><img class="aligncenter size-full wp-image-8259" title="32" alt="" src="https://simg.open-open.com/show/325929069f5495d8bb1471511996dccc.jpg" width="552" height="334" /></a></p> <h2><a href="/misc/goto?guid=4958343297944293314" target="_blank">Concept Feedback</a></h2> <p>Article your own designs to not mention concepts then also attain without charge feedback from the <a href="/misc/goto?guid=4958343263815465165">design</a> community.</p> <p><a href="https://simg.open-open.com/show/fc2fbcb5c780edbdfde7cda8eb24c9a4.jpg"><img class="aligncenter size-full wp-image-8260" title="33" alt="" src="https://simg.open-open.com/show/fc2fbcb5c780edbdfde7cda8eb24c9a4.jpg" width="552" height="291" /></a></p> <h2><a href="/misc/goto?guid=4958343299475189908" target="_blank">Snipplr</a></h2> <p>An informative resource alongside plenty of new scripts and <a href="/misc/goto?guid=4958343277728453199">jQuery</a> methods. <ins></ins></p> <p><a href="https://simg.open-open.com/show/9c316d220945dadc5762c35e6ae5138e.jpg"><img class="aligncenter size-full wp-image-8261" title="34" alt="" src="https://simg.open-open.com/show/9c316d220945dadc5762c35e6ae5138e.jpg" width="552" height="311" /></a></p> <h2><a href="/misc/goto?guid=4958325495531891296" target="_blank">Scripty 2</a></h2> <p>Script2 is actually a powerful flexible Javascript framework to aid anyone write your delicious and even user interfaces. <ins></ins></p> <p><a href="https://simg.open-open.com/show/56acc09d268119b76c1c0c099f603da8.jpg"><img class="aligncenter size-full wp-image-8262" title="35" alt="" src="https://simg.open-open.com/show/56acc09d268119b76c1c0c099f603da8.jpg" width="552" height="322" /></a></p> <h2><a href="/misc/goto?guid=4958343301767692625" target="_blank">Code Sucks</a></h2> <p>Javascript snippets with extremely detailed write ups about how exactly the two perform well.</p> <p><a href="https://simg.open-open.com/show/7152d7bf42fee060bb0ec171e761886e.jpg"><img class="aligncenter size-full wp-image-8263" title="36" alt="" src="https://simg.open-open.com/show/7152d7bf42fee060bb0ec171e761886e.jpg" width="552" height="330" /></a></p> <h2><a href="/misc/goto?guid=4958343302577697704" target="_blank">ZK</a></h2> <p>ZK includes over 200 ajax components, all ready to go.</p> <p><a href="https://simg.open-open.com/show/27c29d622cacb23f7f4d610f09101560.jpg"><img class="aligncenter size-full wp-image-8264" title="37" alt="" src="https://simg.open-open.com/show/27c29d622cacb23f7f4d610f09101560.jpg" width="552" height="310" /></a></p> <h2><a href="/misc/goto?guid=4958184332439761468" target="_blank">Dojo</a></h2> <p>Dojo saves anyone time, delivers effective overall performance, plus scales alongside your own development task. It’s the actual toolkit experienced developers turn that would for building superior desktop not to mention mobile internet experiences.</p> <p><a href="https://simg.open-open.com/show/447472f59da0b87104f4638206b95c95.jpg"><img class="aligncenter size-full wp-image-8265" title="38" alt="" src="https://simg.open-open.com/show/447472f59da0b87104f4638206b95c95.jpg" width="552" height="297" /></a></p> <h2><strong><a href="/misc/goto?guid=4958343304143310303" target="_blank">Javascript Kit</a></strong></h2> <p>One of the original javascript snippet libraries on the Internet <ins></ins>.</p> <p><a href="https://simg.open-open.com/show/86bf5dcbe834edaa0d0bce46bbc5fb68.jpg"><img class="aligncenter size-full wp-image-8266" title="39" alt="" src="https://simg.open-open.com/show/86bf5dcbe834edaa0d0bce46bbc5fb68.jpg" width="552" height="304" /></a></p> <h2><a href="/misc/goto?guid=4958343304943116095" target="_blank">Slidenote</a></h2> <p>SlideNote is a customizable, flexible <a href="/misc/goto?guid=4958343277728453199">jQuery</a> plugin that makes it easy to display sliding notifications on your website or in your web application. It’s also available as a WordPress plugin. <ins></ins></p> <p><a href="https://simg.open-open.com/show/3fb44d9123aca0cde4cb380b8e7d7240.jpg"><img class="aligncenter size-full wp-image-8267" title="40" alt="" src="https://simg.open-open.com/show/3fb44d9123aca0cde4cb380b8e7d7240.jpg" width="552" height="294" /></a></p>