We recently had a friendly debate in our office of which we thought was a better experience but putting personal bias aside there is no right or wrong answer. It all depends on the type of service you are providing.

Content is what defines your website and the reason why your audience will return again and again. Choosing the right browsing experience based on your unique content will enrich the experience rather than leave your audience feeling confused and frustrated.

What is infinite scrolling?

I think it’s fair to say at some point we have all fallen down the rabbit hole of endless scrolling. In short infinite scrolling is a technique used to fetch a continuous source of information as a user reaches the bottom of a page. Pinterest and Unsplash are great examples of the use of dynamic content.

What is pagination?

Pagination is the sequence of numbers used up to divide pages of content that a user can control, you’ll see this commonly used on large e-commerce sites or information websites that update content regularly. 

The pros and cons of:

Infinite scrolling 

Pros:

• Continually scrolling as we know is addictive, a pro…debatable but it does have a better usability experience than clicking

• There is a better chance of user engagement

• Users have the opportunity to discover new content with little to no thinking

• Thanks to social media continuously scrolling on mobile has become the prefered way to interact with content

Cons:

• There is no way for the user to reference or bookmark content of interest
• If done incorrectly it can have an impact on site performance as the page needs to load infinite content as the user scrolls
• Your user will never reach the footer which may house important information for them

Pagination

Pros:

• Your pages will have a good conversion rate because as people are searching it will show in a specific list of items
• It will give your users a scene of control and clarify how long it will take them to find what they are looking for.
• A returning user will be able to identify quickly where the content is

Cons:

• It obstructs the user experience which will lead to lower engagement rates
• If not implemented properly can cause confusion
• So which one is better for you? The bottom line is no ideal or stronger one, it all comes down to your UX and content requirements. The best thing to do is to analyse web and user goals and make decisions based on them. 

Would you like these insights straight to your mailbox?

Your emailSubmit

I consent to my submitted data being processed and stored by SoBold in compliance with Privacy Policy

SoBold is pleased to announce that they have renewed their contract with Transport for London to manage and support a bespoke Cookie Consent Management Tool for use across TfL’s portfolio of websites which includes 30 domains.

SoBold recently became only the 3rd Platinum Certified Cookiebot Partner in the UK having been an authorised Reseller of Cookiebot since the new General Data Protection Regulation (GDPR) came into place on 24 May 2018.

Transport for London’s desire to extend its relationship with SoBold for a further year, highlights the importance of the work SoBold are doing to manage its bespoke Cookie Consent Management solution across its portfolio of website which have missions of visitors per month. The contract renewal cements SoBold’s position as one of the leading Cookiebot resellers. 

For more information on SoBold’s work to date with Transport for London, see their case study.

SoBold Technical Director, Sam Phillips said:

It is great to see Transport for London renew its cookie management contract with SoBold for a fifth successive year. Over the last year we have continued to evolve their bespoke solution adding in full IAB TCF support as well updating the design to reflect TFL’s updated guidelines. We’re looking forward to continuing to support TfL over the next 12 months.

Would you like these insights straight to your mailbox?

Your emailSubmit

I consent to my submitted data being processed and stored by SoBold in compliance with Privacy Policy

As a business in the financial services industry, you have to navigate a range of sector-specific challenges that make it difficult to meet current user expectations with technology. This article will explain why a bespoke development project is often the most effective way to solve those challenges, and provide guidance on how to approach such a project.

For a long time, apprehension towards cyber security and data protection, alongside challenges with decades-old legacy systems, meant that many businesses in the financial services sector were a bit behind the technology curve. Banks and other financial services companies weren’t typically known for their impressive websites or sleek digital processes, at least not until fairly recently. Those days are long gone now, though, as digital transformation and technology-driven innovation have changed the financial services industry forever. 

Today, both your clients and employees alike expect a seamless digital experience when interacting with your services and processes. And meeting these expectations has become increasingly important over the past 10 years or so, as the more traditional finance businesses have faced disruption from trends like FinTech and digital banking. 

But whether you’re a long-standing financial institution, or an early-stage FinTech start-up, there’s a common priority among businesses in this industry – you simply must keep up with the pace of technology in order to stay relevant with your customers and maintain your competitive edge.

Changing Demands from Your Audience of End-Users 

The technology trends we’ve highlighted there will have caused you to shift large parts of your business model online over the past few years. Consequently, that will have created a range of new challenges for you.

Self-Service 

Whatever services or products you provide, your clients now expect the same convenient, effortless experience they’re used to with the technology they use on their smartphones every day.  

When interacting with businesses, most people want to be able to do everything for themselves online, ideally without having to interact with a sales-person or customer service rep. If you can’t enable this self-service in a simple and efficient way, your customers will be left frustrated. 

Cyber Security and Data Protection

The amount of data passing through your business is mind-blowing. All that data can be placed at risk if any technology attached to your corporate network is not secure. When you’re working with such highly sensitive financial data and strict industry regulations, all your technology must be highly secure.

Responsive Design 

Your digital systems need to be highly intuitive, dynamic, and, perhaps most importantly, simple and easy-to-use. That should ideally be the case for all systems, both client-facing and internal. 

User Retention 

If your current website feels clunky, unintuitive, or difficult to navigate, your clients will not hesitate to go elsewhere. While that may have been acceptable with cumbersome legacy systems in the financial services market 20 years ago, it’s simply not an option today.

People will leave a company’s website forever after one poor experience. This demonstrates just how important an excellent user experience (UX) is in retaining your user base.

Similarly, with internal systems like staff training portals or corporate knowledge bases, a poor UX will stifle adoption and usage of the technology. In turn, that will have a negative impact on your return on investment (ROI). 

Using Bespoke Development to Overcome Business Challenges 

In order to break down those barriers and overcome those challenges, many of the leading financial services companies have developed websites that are entirely bespoke. 

Modern enterprise systems need to be dynamic, intuitive, and user-centric. Delivering on all those attributes often requires bespoke development, especially in an industry as nuanced and complex as financial services. 

Your customers, partners, and clients must be able to interact with your services and access their data online, from anywhere, at any time. Not only that, but they also expect personalised content, tailored to their specific needs or challenges, at every stage of their user journey. 

For that reason, it’s often necessary to take the route of a bespoke development project to ensure that your business gains exactly what it needs – and that your users get exactly what they want – in terms of both functionality and capability. 

This covers all the possibilities and ensures your digital presence is tailored to your specific business objectives, the preferences of your users, and unique requirements, including:

• A bespoke website that differentiates you from your competitors
• An online portal, either for training internal users or providing a more engaging experience for your clients
• A new platform that can better integrate with your legacy systems
• A new content management system (CMS) that can provide greater flexibility and scalability 
• A way to transform time-consuming, inefficient manual processes into a unique, easy-to-use digital tool.

Whatever it is your business requires, you can follow the simple, proven process outlined below to ensure your investment in new technology is a successful one.

How to Approach a Bespoke Development Project for a Financial Services Business 

Understand the Purpose of What You’re Building

The first thing you need to do is reach a clear understanding of exactly what you’re trying to achieve with your website. Whatever you’re looking to build, it should align with, and support, your company’s strategic business objectives. 

It should also meet a specific need or solve a specific challenge for the users it’s aimed at. This will help you begin to determine exactly what you need in terms of design, usability, and any other bespoke functionality. 

Define Your Requirements in a Project Brief 

A brief is a simple written document that lists all the key ideas and details you think are relevant to the website or platform you’re looking to build. Use this to list all your functional and non-functional requirements, as that will make the project as clear as possible for the design and development agencies you speak to. 

Try to be as specific as possible to give yourself the best chance of having the project delivered on time, within your budget, and to your bespoke specifications. Without that specificity, you’ll likely be disappointed and could even end up drastically over-spending.

For a comprehensive guide to creating a brief that will set you up for a successful web design and development project, read our useful article here. 

Evaluate Your Technology Options 

In most cases, you’ll use a content management system (CMS) to build your bespoke site. This is a type of software-based platform that allows you to create, edit, and publish digital content across a range of online channels and devices.

Every bespoke development project will be different, so you should aim to select the CMS that best aligns with your objectives, requirements, budget, and other factors.

For example, WordPress is fast-becoming the platform of choice for many forward-thinking financial services businesses, because of the flexibility and fast time-to-market it offers.

To learn more  about how to understand and evaluate the enterprise CMS options for bespoke development, read our helpful related article here.

Find and Select an Agency Partner 

Building, managing, and maintaining a high-performance website in the current technology landscape can be very complex. It requires a wealth of expertise and experience, and also takes time. For that reason, the vast majority of businesses work with a web design and development agency to bring their vision to life. 

The choice you make about which agency to partner with will have a significant influence on the success or failure of your project, so approach this decision with a great deal of care. 

When you’re dealing with such a high volume of sensitive financial data, you must find an agency that understands and respects the critical nature of the work they’ll deliver for you. 

You should consider the following qualities as non-negotiable for your an agency: 

• Proven financial services sector experience and success 
• A strong track record with complex bespoke development projects 
• A long-term partner who can advise and guide you to make the correct decisions
• Certifications and accreditations 
• Compliance with financial services industry regulations
• Secure hosting, with back-up, disaster recovery, and risk mitigation plans
• Security built into the core of every project 
• Automated monitoring, maintenance, and support services
• Ongoing updates and optimisation for your platform
• Training and learning to help you gain maximum value from your investment. 

What Are the Key Components of a Successful Bespoke Development Project in the Financial Services Sector?

There are some key components of a web development project that you can specifically include in your requirements before you speak to any agencies. These will ensure you minimise your risks and mitigate potential problems, both during and after the delivery of the project. 

You should use these as criteria when assessing your agencies and your technology platform, as they should all be non-negotiable for any business in the financial services sector.

Hosting and Performance 

Hosting refers to the physical and virtual data centres used to house your website. It’s crucial to ensure your site will be hosted in a secure environment, with an experienced, trustworthy provider, because this will have a significant influence on things like security and performance. You’re likely expecting to deal with a high volume of data and a large audience of users, so it’s crucial to ensure your website or platform can handle that. 

Enterprise-Grade Security 

Security is not an after-thought, it’s a critical priority. From your choice of hosting services, to your data back-up and disaster recovery, right through to the frequent testing of your live site. Always place this at the very top of your list of questions when speaking to an agency or a technology provider about developing something bespoke.

Personalisation

Providing your users with personalised services and content is another crucial capability for modern financial services companies, but not all platforms can facilitate this. 

In order to ensure your end-users are having their experiences tailored to each individual, some bespoke functionality could be necessary.

Scalability and Multi-Site Development

As business growth is likely one of your key strategic objectives, your site must be able to support that. A scalable platform will allow you to seamlessly expand your online presence as your business grows and your needs change. 

Integration with Back-End Systems 

Like most financial services companies, your corporate network probably includes a variety of old and new systems and applications across all your different departments. If you’re going to have something new developed, you’ll need to build it on a technology platform that can seamlessly integrate with all those relevant systems. 

Ease-of-Use 

Whether or not a technology solution is a good investment or a bad one often depends on how easy it is to use, both for your team internally and your end-users. Usability is a key criteria 

Time-to-Market

One of the great advantages of developing a bespoke site is that you can continue to iterate and improve it based on user feedback. However, you’ll want to ensure you’re able to do so quickly and efficiently. 

Working with an agency, and a technology platform, that enables a fast time-to-market with your development projects is an important part of the process in terms of achieving positive ROI.

Ongoing Development and Optimisation

Following on from the previous point, your web development project shouldn’t stop at the delivery and deployment of your solution. Once your site is live, measure and analyse its adoption and usage. You can use that feedback to continue optimising its capabilities and functionality for the best possible results.

The Business Benefits of Bespoke Development  

While technology does create its fair share of challenges for businesses that are unprepared or unwilling to adapt, it also presents a vast range of opportunities to those who embrace it. 

A bespoke development project delivers something entirely unique and specific to your business, giving you a range of benefits and advantages, including: 

• Improving your internal UX, creating greater operational efficiency
• Improving your external UX, providing more convenient, intuitive services to customers 
• Streamlining mission-critical processes to reduce costs 
• Building enterprise-grade security into the core of your systems
• Enabling real-time interactions with data 
• Increasing customer retention and loyalty 
• Achieving competitive differentiation
• Accelerating business growth. 

In Summary

Financial services has always been a highly competitive industry, but with recent technology trends and changing consumer behaviour, it’s now more important than ever to have a strong, user-centric digital presence.

Not only do your clients and partners demand their data be handled in a secure, compliant way, they also expect a seamless, consumer-grade performance from all digital processes and services they use. Unexpected down-time, poor UX, or any similar frustrations will leave your customers unsatisfied and may put their loyalty in question.

In order to avoid these challenges and minimise your risks, it’s important to find the right agency, with the right technology, to create a website tailored to meet your strategic objectives and exceed your clients’ expectations.

To learn more, read our comprehensive guide to understanding and evaluating the enterprise options for bespoke development here.

Discover how global private equity advisory firm, Rede Partners LLP, transformed a time-consuming manual process into a game-changing client-facing online portal here.

Would you like these insights straight to your mailbox?

Your emailSubmit

I consent to my submitted data being processed and stored by SoBold in compliance with Privacy Policy

Summary 

If you’re looking to build a website for your business, a proven approach is to work with an agency and have them deliver the project for you. This could be a bespoke website design and development agency or solely a website or platform development agency.

Before you approach an agency, however, you’ll first need to reach a clear, detailed understanding of your requirements.

This article will provide an in-depth guide to help you through the briefing process and ensure your chosen agency delivers your project successfully, including a free template you can use to create your own brief.  This template can also be used for other types of development projects as well, including anything from an online portal to an internal training platform.

Where to Start 

Whether you need to design and develop a new website, or rebuild or migrate an existing site, a natural first step is to take your idea to an agency with a view to launching a web development project. 

However, it’s a common mistake to go to an agency too early with just a raw, under-developed concept. Rather than meeting with an agency prematurely, we strongly suggest going through the process of defining your specific requirements and creating a project brief first.

The first thing to do is hold a discussion with the relevant people internally. Talk through the idea, and try to define what it is you need and what you want to achieve with it. Get a clear picture of what that idea or a concept will turn into, but also think carefully about what it should do from the perspective of your end-users. 

Once you have a more tangible understanding of what you’re looking to build, you should begin creating a brief. 

This is a document outlining the key details and requirements for the project. It’s something you’ll need to take with you to your introductory meetings with the agencies you’re considering, as it will be a very useful tool in helping you explain your idea clearly. 

A brief doesn’t have to be complicated. It’s just a simple written document that lists everything you want at this early stage. However, while a brief can be simple, it’s important that it’s as specific as possible too. The more detail you provide for your agency, the more chance you’ll have the project delivered on time, within your budget, and meeting your expectations. 

Why Having a Brief is Crucial

There are some potential pitfalls to be aware of that could create challenges for you if you don’t create a thorough brief. 

Unfortunately, some agencies will be willing to work with you without a detailed brief, glossing over important details and keeping the expectations and requirements vague. This is a red flag to look out for, as it will likely result in one of several outcomes:

• You risk going through a long, expensive discovery and definition exercise that you could’ve done yourself internally for no cost. 

• You risk being given a quote that’s too expensive, or a project timeline that’s longer than necessary.

• You risk receiving a service from the agency that doesn’t align with your request or meet your expectations. In turn, you’ll then have to spend even more time and money on a new project to get your original idea developed. 

A brief is what gives you and the agency a mutual understanding of the work that needs to be done to successfully deliver the project. Without that specificity, you might end up disappointed. That’s why it’s always wise to put some time and effort in up front before taking your idea to an agency.  

Once you submit your brief, you may be invited to participate in a follow-up session to further explore the requirements you’ve listed. This is perfectly normal, and actually a good sign. Experienced agencies will want to talk through each of the elements of your brief with you to help determine the best possible way to deliver those in the project.

How to Create Your Brief 

When you begin to discuss and plan the requirements of your project between your team, we recommend thinking carefully about the following points. 
Please note: There are a lot of things that could go into a project brief, depending on how complex your requirements are, so we won’t include everything here in this article.

The Project’s Purpose and Goals 

Start by thinking about what the purpose of the project is. There’s no use speaking to an agency until you have a clear, specific understanding of exactly what you’re trying to achieve with this project. This should relate to your strategic business objectives, but it should also be designed to meet the needs of your end-users. 

Ask yourself how this will allow you to improve your end-users’ experience or solve a problem for them. Answering this might involve working on user personas or developing user stories, or potentially even working directly with some members of your target audience to gather their input. 

Project Timelines and Deadlines 

Timing is another important point to think about, particularly how much time you have to deliver the project. Deadlines can sometimes relate to certain dates that are out of your control, so it’s better to start as early as possible in those cases. If there’s any flexibility with the timeline for delivery, make a note of that as well. 

Project Stakeholders

Make a list of all the stakeholders involved. This is a good thing for the agency to be aware of early on, because the project becomes more complex with a higher number of stakeholders.

Depending on the size of your business, and the nature of your site, your project team will usually be some combination of: A marketing director or marketing manager, someone from your operations department, and someone from IT. 

However, if you also have people like someone from your IT team responsible for security, a content writer to provide all the written text, or any external consultants, that should be made clear in advance. If your site will need to integrate with other platforms, such as your CRM system, you may have an integration manager specifically in charge of overseeing that as well.

It’s useful to designate roles to certain stakeholders, such as project sponsors, product owners, administrators, and so on. This will help you understand who’s responsible for different aspects of the project internally. 

If you plan to work with external agencies for things like SEO or branding, it’s important to note that in your brief. This is necessary for the development agency to be aware of as early as possible, because collaborating with other third-parties at different stages of the project requires a lot of coordination. 

Certain processes may also have to run differently if other third-party agencies want to be more hands-on or handle some parts of the site themselves. The earlier this is made clear, the more smoothly the project will run. 

Technology Preferences 

If you have any preference of technology platform or any requirements related to your existing tech stack, that will be something you’ll need to decide early on. For example, would you prefer to use WordPress due to its scalability, or do you have any existing investment in any other platforms? 

Think about any preference you have for the various technology choices available, why they’re important to you, and whether your agency will have to tailor their approach to accommodate that.

If you need help understanding and evaluating your options for technology platforms, check out our helpful guide here.  

Budget 

Try to determine a minimum and maximum budget for your project, even if it’s just a loose range for now. It will help you evaluate agencies, and will also help you prioritise the various aspects of the project as “must have” or “nice to have” in many cases. 

Design Look and Feel

This is where your company’s brand comes into play. You’ll want your site to reflect your brand and that will come through in the design. Bring any brand guidelines to the table, and think about what sort of tone or experience you want to convey to your end-users. 

If you don’t have any recent brand guidelines and want help updating them, or need to go through a rebranding process, mention that in your brief as well. Design and development agencies will often be able to help you in these areas too, or at least refer you to a trusted partner who can. 

User Interface (UI) 

How your end-users will interact with your site, and what kind of experience they’ll have, is largely determined by the user interface. When it comes to design and UI, simplicity is usually the best approach. However, depending on the function you’re providing, you might have some specific or bespoke UI requirements. 

Consider your target audience carefully here as well. For example, if most of your users will be accessing your site from a mobile device, it’s probably wise to opt for a mobile-first design.

Some other important things to think about here include how you’d like your sitemap to be structured, especially if you have an existing site that you’re already happy with. 

If your project will involve rebuilding or migrating an existing site or platform, it will be helpful to gather any existing data sources, such as Google Analytics, that will provide insight into your current site.

Non-Functional Requirements

Non-functional requirements are all the aspects of your site that happen behind the scenes. These are things that allow your site to do its job properly for your end-users, but won’t be evident to those people while they’re using it.

There’s a lot of things to consider with non-functional requirements, so we won’t cover everything here.

Hosting

If you have any specific hosting requirements, such as a preference for a certain cloud-based platform, or a particularly secure data centre, those will be important to identify as early as possible. 

Say, for instance, that sustainability is a core value for your business, this could also have an influence on how and where your hosting is managed.

If you have an internal IT team that will be contributing towards the hosting decision, make sure you involve them in the discussion.

Security and Compliance

Security is a growing concern for all businesses today. It’s crucial to think about security as a core component of any web development project, to minimise any potential risks for your business.

If you have someone in your team responsible for security, they should begin to think about issues such as: 

• How will you be backing up the site’s data? 
• What level of data encryption do you need? 
• How will users’ personal details be stored and protected? 
• Will you have two-factor authentication?
• What password recovery process will there be for users? 

Robust security also involves keeping compliant with any specific security or industry regulations that may affect your business. Of course, compliance with things like GDPR should be planned for at this stage too.

Some other common non-functional requirements include things like session management capabilities to track and things like log-in time, session length, pages visited, and so on. Search engine optimisation (SEO) tools, analytics, or other capabilities might need to be built into your site as well. 

Accessibility, Usability, and Responsive Design

When it comes to aspects that will make your users’ experience as seamless as possible, such as accessibility, a good agency will ensure all these things are taken care of for you. This is also the case for ensuring all major web browsers, operating systems, and devices are fully supported and compatible. Development should always be compliant with industry standards, taking into account optimum accessibility and usability.

However, if you have any additional or bespoke requirements for any of these things, those will be useful to note early on.

Functional Requirements 

The term ‘functional requirements’ refers to everything that your site will be able to do for its users, in terms of its features, functionality, and capabilities. 

As mentioned earlier, one of the first things you discussed was what the site will help your end-users achieve. From the perspective of building something your target audience can use, you should start to get a feel for what functionality is required to ensure they can achieve that.

Features 

Your features are the things your site will allow your users to do. These can be very simple, or very sophisticated, depending on what you’re aiming to provide for them. 

When putting your brief together, think of any and all features and functionality that might benefit your users. Your agency will then work with you to explore these and find the best way to turn that into intuitive, user-friendly features for you. 

What to Do Next 

Once your team has been through the process of talking through all the points listed above, you should have a very thorough, useful brief to work with. The next step is to take that brief to any introductory meetings you have with agencies and ask them what they think of the project initially. 

It’s normal for an agency to ask lots of questions at that stage and really dive into the ‘WHY’ behind all the things you’ve put into your brief. A good agency will even challenge you on certain decisions, to help you determine the best possible way to build what you need. 

Once you’ve discussed your brief with an agency, determine which one feels like the best fit. Choosing the right agency is crucial, as it will have a huge influence on whether or not your project is successful. 

As mentioned earlier, some agencies will agree to launch into a project without a brief, and that can be extremely problematic. While the main purpose of a brief is to help you and your agency understand exactly what you need, it should also be used as a way to spot partners who may not be sufficiently thorough or conscientious.

Whichever agency you choose, a detailed brief will help you ensure you’re given a fair quote, realistic timelines for completion, and a finished product that meets your requirements and expectations.

More Helpful Resources 

If you’re considering a bespoke development project, our related article provides useful guidance to help you choose the right technology platform for your specific needs: 

Understanding and Evaluating Enterprise Options for Bespoke Web Development

Would you like these insights straight to your mailbox?

Your emailSubmit

I consent to my submitted data being processed and stored by SoBold in compliance with Privacy Policy

As part of our web design series, we recently explained the process we follow when designing the UX of a website. If you’ve not read that already, it will be useful to go and have a look first before reading this article.

A study by Forrester Research has found that a well-designed UI has the potential to increase your website’s conversion rates by up to a 200% while UX design could raise conversion rates by a staggering 400%. 

Whether you’re working with a web design and development agency or an independent designer, this process is equally important. Nailing the UI design process is a crucial step towards producing a website that will maximise engagement with your target audience and help you achieve your business goals. 

So, let’s take a detailed look at how to run a successful UI design process.

User Interface (UI) Design at a Glance

The UI design process is the creation of the visual design elements of your website. Think about UI as the way in which you convey your brand’s visual identity and bring your UX to life. The UI is there to facilitate the UX.

How Does the UI Design Process Work? 

As mentioned in our related article, UI design is typically the fourth phase of the end-to-end process of web design.

Earlier in the process, we recommend conducting a visual exploration exercise, using mood boards to gain a clear understanding of how your brand will be conveyed and how your website will look and feel.

That visual exploration phase of the project is a pre-cursor to your UI design, as it creates the visual identity of the website, including use of colour, font, blank space, buttons, and more. Some agencies do this as part of the UI phase, but here at SoBold we like to keep it as its own stand-alone phase. You can learn all about the visual exploration phase and how it works here. 

After you’ve been through the UX design process, you’ll have approved a set of wireframes, which give you a blueprint of your website’s structure and flow before anything is built properly.

Once you’ve approved those wireframes, then the visual design created with the mood boards will be applied to bring them to life. This is essentially how you create your UI.

Your agency will typically begin with the design of your website’s homepage. Like each phase previously, you can expect this UI design process to be collaborative. Be prepared to have all the stakeholders available to provide feedback to your agency, and work with them to perfect the design when it’s combined with the wireframes.

Once the homepage is approved, your design will then be applied across all the pages of your site. Again, this is an iterative, collaborative process based on feedback and revisions.

Responsive Design Testing 

On completion of the desktop designs, your agency partner will work on designing the site across multiple break-points. To ensure your site is responsive across all the most popular devices, the following break-points should be tested as a minimum:

• 1,920px – This covers most external computer monitor sizes
• 1,366px – This covers most laptop screen sizes
• 992px – This covers most Notebook and iPad devices
• 768px – This covers most other tablet devices
• 375px – This covers most smartphones.

You’ll then reach the exciting part, where your website is fully designed for you to view, test, and play around with. Once you’re happy with the design across the different break-points, your agency partner will be ready to prepare the design for a development handover. 

What Does Effective UI Design Involve? 

Good UI design is something that should feel seamless and almost invisible to your visitors when they land on your website. The aesthetics and visual style should be simple and engaging, while not distracting from the UX. 

These days, you only have a matter of seconds to make a positive impression that can retain your visitors’ attention, so it’s crucial you don’t over-complicate things. But what differentiates good UI from bad UI in practical terms? 

Like with UX design, there are some best practices you can follow to ensure your website has an effective, attractive UI. 

Follow these guidelines to create a UI that delivers the desired experience for your visitors and supports your website’s strategic objectives: 

• Keep your design simple and your content succinct
• Prioritise the preferences and best interests of your target audience
• Make your design elements as clear as possible 
• Maintain consistency
• Ensure your brand, and your company’s identity, have been accurately represented through the design
• Use power of visual imagery to capture and retain your visitors’ attention 
• Make your call-to-action as strong and compelling as possible
• Don’t create anything that interferes with the goals of your UX.

Check out our related article for seven helpful tips to ensure your website is designed with great usability here for additional guidance. 

The Importance of Accessibility 

Accessibility is the practice of making technology as easy to use as possible, and fully accessible to everyone. While web accessibility is largely intended to help people with disabilities gain better usage of technology, it’s also much broader than that. 

There are people who have difficulty using certain types of, or aspects of, technology who don’t have a disability. For instance, someone with deteriorating eyesight may find it difficult to read small text on a smartphone screen.

It’s also important to ensure your website is as easy to use as possible for the average person as well, because you should always strive to deliver the best possible UX for all your visitors. Accessibility is a key driver of this.

The Web Content Accessibility Guidelines (WCAG), which are used to define what constitutes good accessibility, lists four key principles of web accessibility that should be followed by all websites. 

This means your website must be:

1. Perceivable
2. Operable
3. Understandable
4. Robust.

Web accessibility is an important topic, so we’ll talk more about that in a separate article. For now, it’s worth noting that any web design and development agency you work with should consider accessibility a top priority when designing the UI of your website. If they don’t, you should challenge them and ask why not.

Here at SoBold, this is built-in to all our design processes. We believe that all technology should be inclusive and equally available to everyone, regardless of their physical ability, location, personal background, or any other factors. 

Some design best practices that we’d recommend you always follow to ensure your website is fully accessible, from a UI design perspective, include: 

• Use contrast and blank space to make your content easy to perceive
• Use bold colours 
• Use font sizes no smaller than 14px for desktop and 13px for mobile across the whole site (although, this does depend on the font you use)
• Use headings and structure correctly to organise content clearly on each page
• Make all your content easy to both see and hear
• Write all your copy in plain, simple language
• Avoid any flashing or blinking imagery or video content 
• Write simple, clear, and helpful error messages.

Preparing Your Website for Development 

As you can see, UI design is mainly a case of applying the visual design that was created with the mood boards to your UX wireframes with the agreed flow. Good UI is no more than a clean, simple design that accurately represents your brand identity. While it sounds straightforward, it’s important to remember this is just one phase in the holistic, end-to-end process of web design. 

To conclude the design process after the UI is complete, your agency will prepare your site’s designs for development. To learn how this process works, understand what to expect, and ensure your own web development process runs smoothly, read our next article in the series here.

Would you like these insights straight to your mailbox?

Your emailSubmit

I consent to my submitted data being processed and stored by SoBold in compliance with Privacy Policy