Agile Web design explained

okay, but what is it really?

Written by

NOW|Jack

A lot of agencies claim they do agile web design...

But do they really?

To be fair, it took me some time to convince myself that we actually had an agile development process for creating websites that wasn’t just empty Corp-o-jargontm you say in a meeting to explain why the thing wasn’t finished yet.

Maybe it’s the cynical creative in me, but agile can come across as a bit flimsy. I am someone who wrangles with the deep philosophical dilemmas of what colour I should use for a CTA! I need a truly agile design & development product that I’m convinced by rather than a bunch circular lines on an blog infographic.

Mostly it just becomes a rinse and repeat of the last two stages. It’s still a waterfall just with extra steps

me when someone tells me their process is agile

What's really happening behind those lovely agile infographics


Let's look at the standard development process

Finding the Problem

developers getting excited about the idea of agile working

Okay, no need to get silly, but the normal process for creating something efficiently is to follow a process. This normally involves:

1. Getting stakeholder input in a Hackday to understand the core business

2. Putting that research into prototype designs and information architecture mock-ups

3. Start development work

4. Test

5. Launch

6. Evaluate and tweak

All’s well and good. The problem is however, development just ISN’T agile by nature. It is a posteriori (cool word huh? – look it up) process that requires step 1 & 2 to be completed in order to progress. You can see the benefit of producing designs before the Hackday, because that could stimulate debate. Design continually reacts throughout development by additional requirements not covered by 1&2. but once you get into coding, you don’t really want to mess about radically changing direction. This slows down everything and bugs start to appear everywhere.

Secondly, development is a niche skill. With that knowledge, developers can become gatekeepers to the progress of the entire project. It is essentially their way or the highway. Everyone can have an input on content and creatives but the stuff under the hood leaves very little room for opinion when the skill set qualified to make a judgement is limited to one department.


So how do we solve this?

1. Involvement

How can we involve development earlier on in the design & planning phase

2. Keep 'em Happy

How do we ensure that the gates don’t come down during crucial moments

3. Adjust to change

How can we make development more nimble and prepared to move as fast as an idea can change?

Step one:

Involvement

Develop a great framework that works from day ONE

Those premade themes and builders cost you more in the long run

Have you ever used one of those drag and drop theme builders, or tried to use Gutenberg to design your website? They are absolutely horrible. Endless amounts of clicking, cursing & crashing and you end up with a wonky site that by the time you want to redevelop, you have to start from scratch because all the data is tangled up like spaghetti.

The only solution to a nice looking website: is to code it from scratch. Give content managers SOME control over what goes into metabox fields, but generally the template will be rather static. If you want to change the layout slightly, it requires sending the content to design to imagine up, and then passing it over to the developer to whip up the template. By the time that is finished, an opportunity might have passed.

But it doesn’t need to be that way. Our NOW|Framework is a lightweight, customisable builder where content managers and designers can prototype pages themselves using bespoke elements. Any additional “techy” features only require a small template part to deploy. This removes any requirement to build new templates and field types from scratch. We have effectively created THE ULTIMATE LANDING PAGE builder with the precise control and flexibility you need to deliver fast paced change.

We wouldn't make you something we wouldn't use ourselves!


Step two:

Keep 'em happy

Showing is better than explaining

collaboration is the best form of creation

It’s very easy to do what you think is your departments work and then lob it over and let someone else deal with it. Things quickly become very insular, and negotiating agreement often leads to accepting compromise.


Step three:

Adjust to change

Making a website that is truly responsive

to change...

Responsive websites are so last decade. Who even uses that claim anymore as a selling point? Websites now need to react to change as decision making is constantly speeding up as we access new audiences and markets. That’s a lot of responsibility and workload to put on any developer, especially ones who don’t like change too much.

We believe they should focus on what others can’t. Being technically innovative. If we can pass on the creating of landing pages to someone else, then why wouldn’t we do that?

The second group of people we need to keep happy is the content managers. They spend hours crafting clever alliterated blog titles and social posts. The last thing they really want to do is build a webpage from scratch. That’s why our theme is already doing most of the heavy lifting behind the scenes, you merely just need to tell it how you want the content to be laid out.

We believe in making beautiful websites


So how do we really, really do it?

It sounds too good to be true

It became imperative for us to develop our own framework, because we need everyone in the organisation to be able to demonstrate an idea and not rely on a single member to bring it to life. collaboration is the best form of creation and that initial genius can get lost as it gets passed on from one team member to another. So let’s explain it before I get too Wittgenstein about this…

 

We start with a rock solid core

Now|Theme

Our tailor made theme without the gubbins

We’ve developed over the years a theme with some core styles, functions and elements out of the box. Because we made them, we can adapt them to what your website needs precisely, limiting the need for 3rd party plugins that contain a lot of junk and potential vulnerabilities. But we can’t take credit for everything. We use the latest web technologies to help content managers everywhere to love their websites.

Our thinking is that by using our experience of building websites, there are some core things a website needs to have. If we can preload that into the initial Hack/Design phase, then it includes the development into the rapid prototyping stage. Everyone in the team can contribute and not have to wait for a developer to implement template changes.

Obviously some of the clever stuff requires some siloed dev time, but generally wireframing can be done on the fly.  Having a designer demonstrate something prod-able to a client turns around decisions far quicker than showing them mock-ups that might be subject to change later on.

Bootstrap 5

Bootstrap has come a long way, and we’ve been using it since the beginning. Sure it had it’s history of making the internet of looking EXACTLY the same at one point, but now its a flexible, exciting and easy to deploy framework at the core of most websites on the internet.

Advanced Custom Fields

Frigging love this baby. We push this to it’s limits to give unprecedented user controls exactly where and when they need them. No more sorting through a library of blocks you don’t need only for that theme builder to crash on you.

Now all we need is you...

Start working with a more Agile marketing agency

Learn More about the Agile Stack

I just wanted to say a heartfelt ‘thank you’ for all your efforts. The Sunamp website looks great!

Catherine Dowdell, Digital Marketing Manager, Sunamp