skip to Main Content

UX Design: What does London User UX Designer Do?

What Is Wireframing

User Experience Design, also known as UX design, is the process used to determine the experience your website visitors will have when they interact with your website.

The tools used for UX design include wireframes and a sitemap in order to create the structure for the contents within your website.

Sitemap

Sitemap for UX DesignUX design may be used for the creation of a department store. Decisions are made for which floor and area within that floor that products should be placed. Electrical goods, clothing, and kitchenware are typically on separate floors.

Male and Female clothes will be in separate areas and shoes, underwear and coats will again be separated. You may notice that the shoe department is next to the suit department as these are often purchased together.

Similarly, websites pages are grouped together with page contents and links to further information flowing within the website. How well this works will depend upon the thought given to website users experience whilst visiting your website.

Wireframes

Designer desk with website wireframe sketches. Flat lay

A wireframe is produced after a web designer has discussed the functionality requirements of a website with the client and created a provisional sitemap.

One of the most notable aspects of a wireframe is the fact they do not contain images, illustrations or design elements. They are simply black and white line drawings that outline the placement of different design elements and features such as image gallery WordPress plugins. They also help designers identify key conversion areas which contact forms and call to action buttons can be placed.

A wireframe is created to show the structural placing of different elements, without the actual design features getting in the way. A builder wouldn't construct a house without a structural drawing, as a web designer should not build a website without a wireframe.

Benefits of wireframing

Wireframing has several key benefits for both web designers and their clients. Below we have outlined some of the most obvious benefits that also explain why wireframing is such an important process.

Whereas sitemaps tend to be quite conceptual, wireframes provide concrete evidence of the visual process you have in mind for your project. Even without all of the colours and design work, they provide web designers with something tangible that they can show their clients, to ensure they are happy and on the same page as each other.

As experienced WordPress developers, we don't expect our clients to understand what every WordPress feature is or what it does. Rather than trying to explain it with words, a great alternative is to include it in the wireframe.

Wireframing specific features such as WordPress sliders, review plugins or how contact forms will appear throughout the website can help clients to understand how they function. Instead of focusing solely on how their site will look, wireframing can help clients to understand the importance of its functionality.

Leading on nicely from our previous point - wireframing can be used to find out which features work and which don't work for a particular website. Every element and feature of a website should serve a purpose and provide value to the user.

If from looking at the wireframe you and the client decide that the feature will not assist in converting users in any way, you can simply take it out.

Whether you own a website yourself or design them for a living, you should understand the importance of effective navigation. One of the great things about wireframing is that it allows the web designer to test the site's navigational elements. If the process is found to be too complex or it simply doesn't work, they have chance to go back to the drawing board and make changes, without having to worry about altering any visual or design elements.

Although many web designers see wireframing as an additional step that adds time to the process, it can actually end up saving them a significant amount of time. All aspects of creating a website, from developing it's features to creating the content become much easier if you have a good wireframe in place. It will ensure that everyone from the design team and agency, as well as the client, is on the same page, avoiding delays and hold-ups that can pro-long the website build.

There is a wide range of software and tools that web designers can use to create structural wireframes for their client work. Some of the most popular ones include:


UX Pin for UX Design


InVision Studio for UX Design


Adobe XD for UX Design


Sketch for UX Design


Different approaches to wireframing

When it comes to making a wireframe, different web designers will take different approaches. It will all depend on how you work and the processes that bring out your strengths. For example, some designers find it useful to create a sketch, then a wireframe, then the visual design.

Whereas other designers prefer creating a wireframe, then an interactive prototype, then the visuals, then the code. There really is no right or wrong way to approach wireframing, it's just about finding what works for you and allows you to achieve the best results for your clients.

About WP Design

We’re a London web design and WordPress development agency that creates innovative websites and effective digital marketing campaigns to help London businesses grow. Our address is: WP Design, 20 Jerusalem Passage, Farringdon, London EC1V 4JP.
Call: 020 7193 0938 to request a quotation.

Web Design in London | WordPress Agency in London | E-Commerce Agency in London | Internet Marketing Service

About the Author

Barry Reynolds

Barry Reynolds is a London based web designer and WordPress developer that creates innovative websites and effective digital marketing campaigns to help London businesses grow.

Related Posts

This Post Has 0 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

Barry Reynolds

Barry Reynolds is a London based web designer and WordPress developer that creates innovative websites and effective digital marketing campaigns to help London businesses grow.

Landing Pages: Increase Conversions from London Website Visitors

If you are a small or medium business based in London, attracting targeted visitors to your website is essential to…

read more

London Web Design Degrees & Courses

A career in digital media is a rewarding and challenging profession covering many disciplines including web design, web development, illustration,…

read more

BEST Paid Web Directories For SEO

This article looks at the BEST paid web directories for SEO including DMOZ Directory, BOTW Directory, Jasmine Web Directory, Joeant, Family…

read more

London UX Design Event: UX London 2020

About UX London 2020 event UK London will return over three days on Wednesday,27 May – Friday, 29 May 2020…

read more

UI Design: What does a London UI Designer Do?

When it comes to designing your website, the smallest things can make the biggest difference to the overall user experience…

read more

Photography in Web Design: Improve your London based Website

Photographs can have a dramatic impact on your website design and brand identity. They can be used in image galleries…

read more

Anti Spam Plugins for London WordPress websites

This article looks at the BEST Anti Spam Plugins for WordPress including: Elementor / WP Bakery / Divi Builder /…

read more

Increase WordPress Performance for Your London Website Users

Do you get a lot of traffic to your WordPress website but find that your bounce rate is high and…

read more

Copywriting to Increase London website Google Ranking

If you run a small online business and want to stand a good chance at ranking well in searches, you…

read more

Find Local SEO Keywords for your London Business Website

A great way to get your site to rank for the searches you want it to appear for is to…

read more
mobile phone icon
Back To Top