Website design

Image

Having moved through the initial creative and production processes, now’s the time to test your work in the real world.

Testing – Round 1

• Often, testing is only done by site owners, but end users should be put in front of the site, too, before it’s considered launch-ready.
• Behavioral testing is a huge part of this practice: “If I click this, that should happen.”
• Behavior-driven Web development is becoming the norm, through practices such as BEHAT. This is an open source Behavior-Driven Development framework for PHP. It’s a tool to support you in delivering software that matters, through continuous communication, deliberate discovery and test-automation. It’s essentially a series of “if-then” scenarios.

Review and Going Live

• Only after your draft site is put through its paces against these tests should you allow the client to review it.
• Either make requested revisions or explain to the client why the site should remain as is, then take the site live.

Image

The tenets of good user design fill at least a dozen books, and there will be more. This discipline grows in importance as retail moves more and more online. The learning curve was already picking up speed, but since the rise of the coronavirus and COVID-19, that speed has grown exponentially. We must grow with it, if we are to keep ahead of the very real needs of site users.

• Graphic design is critical to every item seen by the site visitor, from the overall page template, fonts and color scheme to the look of buttons and other repeating elements. The person responsible for this should have a good balance of experience and knowledge in both 2D design and how that applies to an interactive, virtual experience.
• User Experience (UX) design applies to everything from micro-interactions to the whole customer success journey. You test it by walking through the actual process a site visitor must go through. Then ask yourself: How hard was it to do what the fictional user wanted to do? How many hoops do you have to jump through? Could any of them be eliminated or made simpler? Do systems collaborate with each other smoothly?

Image

Quoting & Planning – What WebDev Projects Really Look Like, Part 2
After you've gotten through the Discovery process to find out what your objectives should really be for a webdev project, next steps include:

Quote Submission

• Your "quote" should actually be more of an estimate. We're all familiar with the concept of "scope creep" and—as with any act of creation—it rarely ends up being exactly what we anticipate. Allow yourself flexibility to compensate for this next point:
• Allocate enough time and money for concepting and ideating about UX and testing, and reworking things according to what you find out during testing.
• With any quote, you are setting client expectations. Write it with the thought in mind that you will need to stick to whatever promises you express or imply, so leave room to over-deliver.
• Check out Muffin Group's great web design suggestions and quotation templates to figure out the best way to price your services.

Planning

• If you're going to put the project in front of end users and act on feedback (and hopefully you are), you need to plan for the time and money to do this. All sustainable webdev projects are iterative.

This takes us up to the start of creative production work, which we'll cover in our next post.

Image

In our last post, we discussed the need to recognize that there are two real users we’re designing for in a webdev project: Internal Content Editors and External End Users. 

Web developers must serve each of these user sets, so the users must be defined in as much detail as possible, to set up the needs and expectations of each, which we will use as our design requirements. We call this the Discovery process. 

External Users – End Users/Customers

The site's external end users may belong to a monolithic group, but more likely, they will belong to several subsets, differentiated in terms relevant to the client/site owner’s business or purpose. Your marketing department should research and create a Customer Profile for each subset of typical customers.

• These profiles should be generated using known demographic information as much as possible. Relevant demographics will change according to client needs.

• Other salient points about them will have to remain conjecture, until use of the new site reveals observable data about external users.

• When building the project timeline, the webdev project manager should be tapped to follow up on this information, which should help determine anticipated needs and desires for the website's ongoing features and functionality. This way, all future updates are based on actual feedback.

Internal Users – Content Editors

In reality, the Internal User is the first one to consider, because the content editor will be the first one to use the site before actual customers do. They will be inputting and updating text, images and media before the customer ever sees it, so they are key to the success of the site.

• Because there can be several levels of internal users, each should be represented by a Persona Story, also created by your Marketing department.
• A Persona Story is a pseudo-personality profile and needs assessment that will help determine the features and functionalities needed on the site.  

We’ll cover the questions used to build the Persona Story in our next post.

Image

When we start a webdev project, good UX design must be foremost in our minds from the beginning. And good UX design begins with empathy: We must design the entire user experience to fit the type of person who will be using it most. This determines who we’re really working for. The client may be paying for your time and expertise, but the real “boss” — the one driving our decisions and choice s— is the user. So it’s necessary to define our actual user base. 

For any website, there are actually two main types of users:

1. External (Customers/End users)

2. Internal (Content Editors)

Every web designer knows of and thinks about the first category, the end user. But if we’re going to be designing for successful, long-life websites, we need to consider the fact that all such sites will be continually updated at least with content, if not functionality. That means someone inside the client’s organization, or at least someone contracted by them, will also be using the site from the back end.

Web developers need to build interfaces to function well, for visual attractiveness, and clean coding. They must serve each of these user sets, so the users must be defined in as much detail as possible, to set up expectations. We’ll discuss specifics in our next post.

Image

At the heart of effective User Experience (UX) Design, which is critical to the creation of successful websites, is Human-Centered Design. This is the term for the expression of the oldest and most central design rule in website development: Form must follow function (FFF).  

In other words, you start with the purpose of the thing you’re designing — What is it supposed to do, why, and who’s going to be using it? — and make sure that every decision you make during its design is based on the answers to those questions. The form of what you're creating must follow the function it is supposed to serve. 

Sounds like a no-brainer, right? Actually, not so much. Many folks approach a design project with preconceived notions or they see it as an opportunity to try some new technique or methodology they’ve heard about, whether or not it serves the purpose of the project.  

That’s why the FFF rule is so critical: It serves as a strong guiding influence on decision-making the whole way through the webdev project. Some will see this as a constraint to their creativity, but in reality, it’s a way to save all involved from going down innumerable rabbit holes that won't ultimately pay off.

In our next post, we'll look at the 3 basics of Human-Centered Design.  

Image

Regardless which content management system (CMS) people use, unless they are dedicated content managers, they are usually administrative professionals primarily responsible for other activities more traditional to their jobs. This makes web content updates just another burdensome task.

If the CMS they’re required to use is difficult, stressful and unrewarding, they will avoid doing it. If you notice a strong resistance to this task in your organization, we’re probably talking about you. At Resonetrics, we can prescribe strategies to successfully deal with your particular situation.

Generally, we start with an introductory interview to learn your specific needs and situation. Then we talk with your designated content editor, to objectively determine whether that person really has the skill set (or the willingness and potential to develop it) and bandwidth to take on the task consistently, as part of their position. 

If so, we may offer to help onboard that person to a professional standard, using task modeling and checklists to help establish a repeatable routine that produces the results you seek. We will also help your designee navigate your organization's particular culture to make sure they get what they need for each website update.

If your designee does not appear to be a good candidate for the content editing role, we will help you find someone among your team members who is, or recommend external sources to locate a better fit.  

Image

If it’s being done right, every organization’s website content consists of material provided from across the breadth and length of their expertise and knowledge. This means a variety of voices, language usage, tonal approaches, visual design and image types are being submitted by various contributors in all departments and sectors of the organization.

In an enterprise-level organization with many departments and subdivisions, it’s even more critical that this disparate content is well-edited and organized, to shape it into a coherent, single voice for the client.

This is a skill set unto itself. Not everyone has it, but everyone can learn enough to ultimately execute at a higher level. And for consistently top-tier content, you may find yourself retaining outside help.

For visuals, you can retain a virtual assistant (VA) with some training or background in photography or illustration to help you source, identify and edit images you'll need. For text, you might want to hire a commercial copywriter. It's important to hire the right one, and fortunately it's not difficult to find an experienced copywriter who has some background in your client's particular industry.

If the thought of having to locate, interview and secure the services of this outside talent sends you running for the hills because it's just way more time and effort than you have to spare, it might be time to hire an all-around digital marketing partner to do all that for you.