Website UI specification builder? [closed]

Question

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.

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.