What are web page prototypes made of?

Question

css

All physical education hello. - I'm going to get hired to work as a layout designer. I'm pretty good with HTML-CSS-jQuery-Bootstrap. - If necessary, I work in the “shop” myself, but I don’t like to understand other people’s PSD layouts, since 90% of the “designers” sculpt layers at random, they don’t want to hear about the 12-column auxiliary grid, and in such cases the devil himself will break his leg later, to translate such layout from PSD to HTML-CSS. - Nevertheless, in the requirements for both future "personnel" layout designers and freelancers for "outsourcing", employers almost without exception require experience in "cutting and stretching" from PSD layouts. - To be honest, I thought that the era of such an approach a la "Popov, Zakharenko, Smolyaninov" was over, and now it is not necessary to draw buttons with shadows and gradients in Photoshop. - Then what is it? Is there such a trend - to use the "shop" as a UI prototyping tool or personnel officers just "drive" out of habit? - What are the prototypes of future web pages really and massively made on now? - What are they currently using for these purposes?

Answer 1

Something you have all in one heap.
Wireframe can be done even on paper, I personally like ninjamock.com Prototypes (clickable pictures from the design, not
to be confused with layout) can be done in invisionapp.com

experience "cutting and stretching" from PSD mockups

this is what, in my understanding, a layout designer should actually do - make html code from PSD layouts.
I would be wary of the word "stretching" - this is usually done by the programmer (but again, not always).

Answer 2

I think you are a bit confused with the terminology.
Prototypes (wiframes, mockups) can be made, for example, on paper . Can in specialized software (such as Axure). Some designers throw in prototypes from a ready-made UI kit right in Photoshop (a vicious approach, in my opinion).
Layouts of the same design are drawn in Photoshop. it is an unrecognized industry standard for website design. Well, how without drawing buttons? Naturally, you can immediately figure out the code, but, IMHO, this is more expensive.

Answer 3

@Rrooom Here, and I don’t like that money is still being beaten out of the client for such an expensive process as PSD -> HTML (unless, of course, it’s not a blunder to relate to it) in an environment where, in general, on the Internet everything has long been "designed" and laid out. - We see in the network 99.99% forks of existing layouts. - So let's honestly admit to ourselves that we are still forking and will stop treating each new layout as a "groundhog day" or "the edge of reality" or "bast on a stake, start over" (whichever one likes more). - Is there someone here who will share their experience of quite a decent conveyor layout?

Answer 4

I myself have recently begun to dive into the depth of the skills of a layout designer, and as a hereditary admin, I thought a lot that in our century there should be technologies that will remove the routine from life. And it turned out that Yandex has been stomping the path of innovators for a long time and they made just such a BEM thing that still needs to be mastered. as I understood from the descriptions of the technology, it is possible to sausage templates in batches by leaps and bounds. but that’s about where the design layout is taken from until I didn’t read it, unfortunately, therefore I won’t tell you. but probably from the same PSD.

Answer 5

AxureRP is a great prototyping tool