I would like to be able to "build" my specifications for the User Interface of a website.

EDIT: I am not looking for Wireframe techniques/tools nor prototyping techniques.

EDIT: I look for a tool to interactively create UI specs for a website. Specifications only.

EDIT: The result when using this tool would simply be a document (ie. A spreadsheet) listing all the specs for a given feature.

Ideally, I would like to even be able to tell the business to use this tool & simply send me the result of the specification builder.

To put things into a concrete example, if the business says "hey, we'd like a facet search". Then I should be able to use that tool (ie. sit together with the business) & literrally "build my specs". It'd then prompt me for things like "do you need different filters?", "what are the filters' name", "do filter appear all the tinme?", "do you want to see the applied filter?", "do you want to be able to individually remove applied filters?", "do you want the facet search to be available for all users?"... and so on.

I thought I was lookig for something that already existed, but I found nothing out there.

  • I'm confused with what you're asking. Are you asking how to build something like this, or, is there a tool out there that I can use to make such a thing?
    – UXerUIer
    Commented Sep 4, 2014 at 11:48
  • I am asking if there is something I can use to make such thing (to interactively create specs for a website)
    – Adriano
    Commented Sep 4, 2014 at 11:51
  • The idea is that the result would simply be a document (ie. A spreadsheet) listing all the specs for the feature
    – Adriano
    Commented Sep 4, 2014 at 11:53
  • I'm afraid it's called a "UX person". Or, to be more exact, "a wireframe sketcher". Commented Sep 4, 2014 at 12:53
  • 4
    Voting to close. Requests for products are unsuitable for this site because they have no one correct answer and quickly become outdated. Commented Sep 4, 2014 at 15:22

1 Answer 1


To create an interactive prototype, the route I usually take is creating the HTML/CSS file that will list all elements with code to the right side (if necessary). Kind of like how twitter's bootstrap does it on their pages.

As for just creating a static page out of your photoshop files, I've found using this to speed up the process. However, let me warn you about something. PSD to HTML is dead - or at least dying. Creating a PSD (unless showing to clients) for your team is not a good idea. There is a lot of loss in translation when showing your design to developers, because they will interpret things differently. Instead, create a prototype (whether through HTML/CSS/jQuery, InVision, etc) to fully show them what you intended interactions to be.

  • 1
    +1 for the PSD to HTML is dead. The closer to the final deliverable the better.
    – Jbm
    Commented Sep 4, 2014 at 12:58
  • I agree wholeheartedly! You want your clients/team/self to know what it's going to feel like when it launches.
    – UXerUIer
    Commented Sep 4, 2014 at 12:59
  • Although I like your answer as it raises valid/interesting points regarding "new feature workflow", you have misunderstood what I am looking for. I have edited my question for more clarity. I'm afraid the tool I'm looking for does not exist though.
    – Adriano
    Commented Sep 9, 2014 at 8:59

Not the answer you're looking for? Browse other questions tagged or ask your own question.