What website wireframing tools are available online, or self-hosted? [closed]
Asked Answered
A

9

13

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
Adigun answered 24/11, 2009 at 19:3 Comment(3)
For future refernce, here's a list of 10 free wireframing tools speckyboy.com/2010/01/11/…Adigun
Amazing how many good questions are getting closed left and right lately........Eisenach
Who downvotes a closed question from more than 5 years ago?Adigun
N
4

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.

Neighbor answered 24/11, 2009 at 19:6 Comment(0)
S
5

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

Balsamiq

Simonton answered 24/11, 2009 at 19:9 Comment(0)
N
4

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.

Neighbor answered 24/11, 2009 at 19:6 Comment(0)
M
4

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).

Mainz answered 25/11, 2009 at 16:2 Comment(0)
M
3

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

Muricate answered 24/11, 2009 at 19:29 Comment(1)
+1 for Mockingbird, fantastic toolDuffie
F
2

Firefox pencil plugin

Future answered 4/11, 2010 at 16:14 Comment(0)
M
1

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

Marlea answered 25/11, 2009 at 15:34 Comment(0)
D
1

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.

Devy answered 25/11, 2009 at 15:40 Comment(0)
D
1

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!

Depart answered 25/11, 2009 at 21:40 Comment(0)
E
0

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.

English answered 29/11, 2010 at 18:22 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.