CentrumPR.pl

What is a website mock-up?

Zamów artykuły sponsorowane na serwisie CentrumPR.pl w kilka minut, poprzez platformę Link Buildingu np.:

Przeczytaj również

• Jak zorganizować urlop na ostatnią chwilę?
• Właściwości i zastosowanie oleju z czarnuszki
• Te cechy strony www musisz sprawdzić, zanim zabierzesz się za cięcie layoutu!
• How to deal with the white screen of death?

• Podstawowe informacje o CentrumPR.pl

Mock-ups are the outlines of pages or applications that allow you to plan and check the structure of the page and its functions. The mock-up allows you to analyze and test the finished project in terms of its usability. Such outlines should be handled by UX designer, but in reality, it is often done by a graphic designer or other people from the project team.

The model is usually delivered to the client in a digital form (for example PSD files), but a mock-up can also be a good quality hand-drawn sketch. There are two types of mock-ups:

• lo-fi, or low fidelity – these are models with a low degree of detail and accuracy,

• hi-lo, or high fidelity – these are precise models with a high degree of detail. They can be created, for example, in PSD files.

Why it’s worth doing mock-ups before cutting PSD to HTML?

Do not cut PSD to HTML if you did not do the mock-up. Why? Well, thanks to the mocking-up, you increase your chances of creating a useful, well-thought-out website. Mocking-up allows you to:

• check user's paths on the page (if the navigation is well-designed),

• try out ideas that would be expensive to implement (in the case of modeling you only bear the cost of paper and pencil or time spent on PSD files),

• better communicate in the project team (instead of talking about your ideas, you can visualize them),

• test different variants of presenting information on the website and checking which one is the best choice,

• communicate with the client who can see the planned structure of the website and participate in the testing of new ideas.

What are the elements of the mock-up?

Remember that the mock-up is to refine the functionality of the site. It is a waste of time for sophisticated photographs, a refined palette of colors or searching for the appropriate typography. The mock-up uses:

• placeholders instead of photographs or graphics (the whole page is built of squares and rectangles),

• shades of gray instead of a full-color palette,

• simple comments instead of extensive interactions (if you are making a static model).

Programs that will help you create a mock-up are, for example, Axure RP, Moqups.com, Pencil Project, WebZap (the last one is a plugin for Photoshop, which enriches the program with the ability to create mock-ups in your PSD files).

Your client responds to static mock-up with horror (eventually there are no colors on it), or for any other reason you need a very qualitative, detailed mock-up containing interactions? You can use programs to create perspective 3D web mock-ups. You can find the right tools on the web by typing in the search engine, for example, the phrase: PSD Perspective Mockups.