English 中文(简体)
What website wireframing tools are available online, or self-hosted? [closed]
原标题:

I m looking for an easy to use wireframing tool. I ve heard of gliffy, are there any others?

Specifically, I d like something that is

  • Easy to use
  • Supports collaboration
  • export to html and css
  • lets me show the wireframes to the client. Allowing annotations would be a nice feature.
  • low cost, or free
最佳回答

Creately

Creately isn t really free, but you can pay them whatever price you think it s right (even $1). Some features (from official website):

Business Diagrams

* Process Flow (BPMN)
* Online Flowcharts
* Concept Maps
* Mind Maps
* SWOT Diagrams
* Organizational Chart

User Interface Design

* Wireframe for Website
* UI Mockup Wireframe
* Web Flow Charts
* Online Sitemaps
* Mockup Screens
* Desktop Software Mockup

Software & Systems Diagrams

* System Diagram and Design
* ER Diagrams (Entity)
* Data Flow Diagram (DFD)
* UML Diagrams
* Class Diagram
* UML State Charts

Network Diagrams & more

* Home Network Diagram
* Office Network Diagram
* Data Center Design Layout
* Capacity Planning models
* Digital Circuits

Creately example

Mockingbird

Another option is Mockingbird. Their "motto" is:

  1. Mock it up fast. Drag and drop UI elements to the page, then rearrange and resize. Go from idea to mockup in minutes.

  2. Make links. Link multiple mockups together and preview them interactively to get a feel for the flow of your application.

  3. Share with a click. Sharing mockups with colleagues or clients is as simple as sending a link. No more emailing folders of jumbled images.

Mockingbird example

Mockingbird is made using Cappuccino framework.

问题回答

Balsamiq , not complete free but you can work with it.

Balsamiq

You could just wireframe in HTML.

Seriously, don t ignore the advantages of what straight HTML wireframing can offer to the process or what tools there are to make it easier and effective. Things like jquery and polypage make HTML a very powerful and capable wireframing and prototyping tool.

I wrote a blog post a while ago that explains some of the advantages and tools of straight HTML wireframing (sorry for the gratuitious self promotion).

Another great website wireframe/mockup tool is Mockingbird ... it s collaborative and does decent export.

Firefox pencil plugin

http://mockflow.com

Mockflow is the best I ve worked with so far and I ve tried quite a few. Web based and free for one project. Very friendly to UI-minded non-designers

Microsoft Expression Blend. It s not free, but the Sketchflow feature in version 3 not only lets you create wireframes, but lets you publish them to the web, where users can comment and annotate them, and it collects the comments and returns them to the design team.

There is a 60-day trial version that is free, and Sketchflow tutorials on the site.

ProtoShare is web-based so it works with all platforms and your clients don t have to download the software to be able to view and make comments. It s not free, but plans start at $19/month with a 30-day free trial.

In addition to clients having the ability to comment, designers can annotate the wireframes as well. Right now, you cannot export to HTML or CSS, but you can use CSS in the app to get the right message and styling across. HTML export is coming though.

Good luck in your search!

With LucidChart you can create interactive wireframes. They have a free version with a limited subset of the wireframing capabilities, but their subscription prices are very reasonable.





相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签