Stories, updates and ideas from Jellypepper

Blog

Gamification is a technique that applies game-like principles to non-gaming activities. It’s designed so your users feel more engaged or motivated while using your product, which will lead to better engagement overall!

Ever notice how some apps feel more addicting than others? Like they're almost a video game, even when they're not?

This is a UX tactic called gamification - a technique designed to insert gameplay-like elements such as progression, achievements and obstacles that make a product feel more enjoyable and engaging. It's well known now and used commonly as a growth or conversion tactic in many websites, products and apps as it has a proven track record. But how does it actually work?

Gamification relies on the same principles of behavioural psychology that you've probably encountered before:

Classical conditioning: when our actions are accompanied with a pleasurable outcome or reward, we'll associate those behaviours with happiness and want to repeat them. This is why gamifying your app can be so appealing for users as they get points, achievements, etc. which makes it feel more fun to use!

Operant conditioning: this theory follows operant behaviour where rewards reinforce certain patterns of behaviour within an individual - like how getting some likes every time you post a photo might make us want to share photos even more because there's incentive involved.

Cognitive dissonance: if we're presented two conflicting pieces of information at once (e.g. you're working out but you still see your sweat and hear the music) we'll want to reconcile these feelings by continuing with our workout.

The "Ikea effect": when we put in a lot of work ourselves, or feel like it was hard-earned, we'll value that thing more - like how people might enjoy using an app after they've spent time building their profile themselves (for example).

Expectancy theory: this is where someone predicts what will happen based on previous experiences or results. For instance, gamified apps are often designed well so users should expect them to be enjoyable because they've been designed well!

It's important for designers not only to understand these theories behind gamification, but also stay up-to-date with the new techniques and strategies that emerge.

Here are three gamification tactics you can use on your website:

Engaging: gamification can keep users on your site longer. Fun, interactive content and design will encourage them to stay logged in or return frequently.

Incentivising: the use of rewards as motivation for completing tasks is a proven technique that incentivises desired behavior with tangible recognition (such as badges). This may increase engagement and conversion rates by giving people something they want - such as achievement, digital products or access to new features - not just money!

Unexpectedness: this means adding elements into your product that are unexpected much like you would in a video game. Some examples are surprise levels where you have no idea what's coming next, hidden messages or random events unfolding while the user interacts with it

There are are few ways to gamify your app.

Incorporating gamification elements into existing features to increase engagement, such as adding a progress bar or achievement badges that can be collected.

For example, if you have an app for ordering and picking up food, gamifying the process by giving points every time someone orders anything from your service is another way of incentivising people to stay logged in or return frequently.

Or let's say there are two different types of coffee beans you offer on your website: one is more expensive than the other but has double caffeine because it's darker roast. You could provide either some kind of visual indicator (maybe with colours), where dark = more caffeinated; or actually list what milligrams per ounce each type has next to their price.

Or, if you sell clothes and want to gamify the process of finding an outfit for a work-day, then maybe show what outfits are trending in your area or offer some kind of competitive game where people can join a team.

What are some bad examples of gamification?

Some bad examples of gamification are offering coupon codes for a limited time or limiting access to your site. The best example is when you offer something that's free but make it difficult to find or use, those tactics will have poor results and annoy users rather than engage them. The challenge for UX Designers is to gamify in a way that's engaging and fun for the user.

Manipulation: this gamification technique is more like a marketing tactic where the company tricks people into buying something

Punishment: this type of gamifying aspect may be seen in video games, but it's not a recommended UX design strategy. This can frustrate and anger users as they feel their time or progress was wasted

Novelty factor: some companies create games that are engaging for one day only before getting old to the user

Exclusivity: another bad gamification example would be limiting access to certain features based on if someone pays money or has status with your site/product

The best way to avoid these pitfalls? Do research beforehand! There are plenty of articles about what good gamifications looks like so you don't have to go through the trials and tribulations of making your own.

The psychology behind gamification and how you can use it to increase engagement with your users!

Gamification: A Growth Technique With Proven Results

The Design Sprint is a framework developed originally by Google Ventures and has been used in many great startups and companies to rapidly ideate, test and launch new ideas. They're flexible and can be used to solve a whole range of problems and address opportunities, such as:

Designing better products and services by asking the right questions in a focused time frame.

Generating new creative ideas for solving problems, instead of relying on old ones.

Getting feedback quickly from your friends, family or customers to make sure you’re building what they want/need.

Design Sprints are based on traditional Design Thinking methodologies which consist of employing logic, imagination, intuition and systemic reasoning to solve tricky problems.

IDEO, the design firm co-founded by Apple's late CEO, Steve Jobs, developed are large advocates and thought leaders in the Design Thinking space. While Design Thinking was first introduced in the early 1990s, but it wasn't until 2011 that Design Sprints were introduced.

The first design sprint was a competition to solve an urgent problem for Google's AdWords team. They wanted to make sure the new version of their product would be ready and launched by January 2012. The winning team used this time-crunching new approach to quickly prototype and test out their ideas.

Design Sprints have been used from the smallest startups to the biggest tech companies.

Facebook used Design Sprints to create a cleaner-looking design for their platform.

Blue Bottle Coffee Company used Design Sprints to create a new customer experience, ensuring their coffee was fresh and delicious.

Netflix has also used design sprints with clients like DreamWorks Animation to come up with ideas for TV shows.

In addition to startups and tech companies, the Sprint framework is embraced by government agencies, NGOs and corporations — such as Nike and GE — to innovate faster than ever before.

The Design Sprint process breaks down into a series of tasks that are completed in five days (or less). The sprint is split up based on the day.

☀️ Morning: long-term goals, questions, risks, assumptions, map that shows general user journey

🌥 Afternoon: talk to experts on parts of the problem, interview them (timer) to improve our map. take notes with HMW, aggregate by category and vote on most useful for prototyping. Pick a target customer, spot on the map, questions from the morning to focus on for the sprint.

☀️ Morning: Lightning demos (solutions from your / other companies, tours of products) and draw good examples on whiteboard.

🌥 Afternoon: Sketching. Taking notes, jotting down ideas, crazy 8s, finished sketch (solution). Aggregate all the sketches.

☀️ Morning: review sketches in silence, parts they like and don't like. structured critique on which parts we should bring in to prototype and dot voting. then decide on what's going in.

🌥 Afternoon: put concepts head to head in a rumble. combine sketches + map from first day into storyboard.

☀️ Morning: Pick the right tools to make your prototype (like Keynote or Figma), divide and conquer and start prototyping

🌥 Afternoon: Gather the team, trial run the stitched prototype, review and test

☀️ Morning: Bring in customers and interview them with the prototype, watch their reactions. Rest of the team will be watching and taking notes.

🌥 Afternoon: Combine notes, look for patterns, draw insights and prepare for the next sprint. Make a plan for the next sprint.

Design Sprints are a perfect fit for anyone who wants to make the best decisions quickly, create new ideas that haven't been explored before or get quick feedback from the people they're building their product/service for.

They're perfect to use when you're on a tight timeframe or working in a super agile environment. Traditional design thinking is more open ended - it can take as much time as you need to solve problems from scratch.

Where can I learn more about Design Sprints?

Jake Knapp, Mike Donoghue and John Zeratsky, the creators of Design Sprints have been teaching workshops all over the world. They've also written a book about it which you can purchase online or in stores!

You can also explore Google's Design Sprint Kit which includes supporting documents and templates, as well as new methodologies and examples.

Design Sprints take traditional design thinking methodologies and compress them into a five-day process of rapid ideation.

Design Sprints: The 5-Day Process for Rapid Ideation

The idea of pure functional design is an inevitable progression, stemming from the philosophies of reductionism, minimalism and functionalism. As product designers, it's easy to justify spending less time thinking about feelings of depth and more time focusing on minimising friction, peeling back the decor to improve the conversion rate.

There's a fantastic podcast by Tobias van Schneider on the NTMY show where he interviewed Stefan Sagmeister, co-founder of Sagmeister & Walsh Inc. and an influential graphic designer, storyteller, and typographer. Upon raising the concept of product design, Sagmeister said the following:

“I feel like we will reach a time, pretty soon, where we will look back at this idea of pure functionality, and we will shake our heads and think…”

Many designers believe our societal shift to “less is more” design is a sudden mistake, but in reality it is neither. This shift began with German and Austrian concepts of modernism over 100 years ago when Adolf Loos published Ornament und Verbrechen, an essay and lecture that proclaims “the evolution of culture marches with the elimination of ornament from useful objects”.

In other words: aesthetic and decorative flairs can have the effect of causing objects to go out of style and thus become obsolete, so we should eliminate “design” from functional objects to make them timeless.

This piece was published during Art Nouveau, a time when academic art and design was inspired by natural forms and structures, particularly the curved lines of plants and flowers. The challenging nature of the essay paved the way for German modernism in architecture, such as Staatliches Bauhaus (i.e. the Bauhaus movement), describing the ornamentation of objects to be “immoral and degenerate”, a suppression mechanism for regulating modern society.

This raises some really interesting questions in itself. Does our society have an inherit emotional need for ornamentation? What would happen if we eliminated decorative design altogether, printing everything in plain black-on-white Helvetica like a universal homebrand?

Over time, this concept led to an economic functionalism. Less time spent on design and more efficient use of layout resulted in more growth and more conversions. Now we’re seeing the result of this in technology startups.

Loos eventually concluded that “freedom from ornament is a sign of spiritual strength” which you might recognise from the modern lifestyle philosophy of minimalism: the detachment from reliance on physical objects to satisfy one’s self-worth and the focus on personal being, happiness and relationships.

“Freedom from ornament is a sign of spiritual strength”

But let’s jump forward about 80 years to the introduction of the world wide web - an incredible new canvas for designers to experiment with. The first sites ever available were a bleak landscape of simple text-based sites built with just HTML. Web 2.0 came around in the early 2000’s which gave designers a plateau of new features to abuse. You might remember we ended up with lengthy drop shadows, shiny bubbles, oversized buttons and glares.

Skeuomorphic design became a huge trend in 2010 which went against Loos’ philosophies: incorporating the visual characteristics of real life objects into a digital design, recreating them in a highly ornamental fashion. Then, as the popularity of skeuomorphism began to decline, flat design took its place.

Since 2016 we’ve been branching out again, exploring semi-flat design, cinemagraphs, animations, bold colour choices and an increased use of geometric shapes, patterns, lines, circles and 3D rendered assets. We’re starting to turn the wheel again on the concept of ornamentalism.

But what about the future? Will we end up with Loos’ dream state - a world where decorative design truly doesn’t matter and minimalistic beauty takes over - or perhaps a trend of ornamentation that we haven’t explored yet? Such is the everlasting question for the designer who enters this brave new world.

One example is futuristic ornamentalism, where the growth of industries such as Augmented / Virtual Reality, Artificial Intelligence and Machine Learning will pave the way for a new era of design. Product designers like Gleb Kuznetsov, a Product Designer at Fantasy, are already exploring this area with unique experimentation and futuristic design concepts.

Take the Dribbble shot above for example. As an onboarding technique, this could be done a lot more efficiently with just a button. Less friction and a simpler interface. But it’s the experience of interaction, the feeling of drawing a circle and the emotional response when you’ve directly interacted with a new form of intelligence.

Apple have also started exploring this area of design, particularly in relation to Siri. Their new design language and animated visualisations for their voice recognition software paints the tool in the same light as artificial intelligence, which raises a question about the future of this type of design: how does the evolution of artificial sentience affect our ability to convey its depth?

Another example is the futuristic military-style minimalism we see in movies and video games about space travel. Much like Loos’ interpretation of the elimination of ornamentation, a higher reliance on smooth surfaces, polished materials and neon lights compensate for the limited choice of typography and incredibly constrained colour palette.

This style focuses on precision and function by promoting the interactive and accessibility elements of a design, making the point that the simplest form of aesthetics creates the best user experience.

There’s plenty of other alternatives and their futures are steeped in chance, practicality, design trends and cultural shifts. Every trend is valid in terms of artistic merit so it just comes down to which one you pick and how you justify it. But regardless of what the universal future of design is for us, right now Stefan Sagmeister has a point:

The crap happening now in technology that concentrates on functionality shares the same mindset as the Soviet building factories: let’s make it work. But that’s not human, that’s not who we are. Beauty is a core part of humanity. The shit we are making now that is purely functional is inhuman. That is: not made for human beings.

The industrialisation of product design has had a profound impact on the modern interpretation of design.

Pure functional design and its role in products

A few weeks ago, we received a super interesting question from a fellow designer:

“Any advice on getting the startup I work for to put extra care and effort into design? The design team are always keen. It’s the engineers and management who aren’t always as excited.”

It got us thinking -  why is it easier for designers to see the value of a great design over engineers, founders or marketers? The answer to that question is the same reason designers have a hard time convincing their companies to start design teams or invest in design.

If you’re keen on changing the way your company views the importance of design, here’s a couple of talking points that have worked for us in the past.

Convincing an early-stage company to hire more designers is hard enough. Convincing them to put a design team together is almost impossible. Early-stage startups only see tangible value in a small handful of activities - namely Operations, Technology and Growth / Marketing  - because they have a simple, measurable ROI (return on investment).

“The impact of design is notoriously difficult to measure. We know intuitively that great design leads to great products, and understand that it can influence business success in a multitude of ways, from strategy to market expansion to brand expression.”

That's fair enough - if you’re just starting out, your company’s goal is to stay alive until such time when they’re sustainable enough to diversify their operations. At some point though, their customers are going to expect an amazing product and to do that, they’ll need to grow the product team.

But even if your company does hire more designers, they’re simply putting them to work on solving the current problems. In the long-term, you might just end up being a less sexy version of a competitor who invested in design from the start. The best modern tech startups invest in a culture of both design and engineering throughout the company.

“Today, much less capital is required for entrepreneurs to create a product and start a company, leading to an influx of products on the market. Design then becomes the differentiator for these products and companies.”

It’s never too late to start creating a culture of design in your company. Not just in product and engineering either  - every department in your company should reflect the values and identity your brand team have figured out.

“Design without purpose is meaningless”. This applies to design teams as well. Design becomes incredibly important at scale -  one of the primary reasons great companies start producing bad content is due to the lack of diligence around design and consistency of quality.

It's not about talent either - it's about focus. It becomes very clear when a company values closing leads and hitting KPIs over producing quality work. When this happens, designers are discouraged from improving the brand under the pretence of consistency, causing them to produce work they’re not proud of.

“Design is core to what we do. It determines the directions we take, the features we build, and the ways we communicate with our customers. It’s our hope that the carefully-crafted Robinhood experience will inspire more and more people to start investing.”

If this sounds like your company, it’s not a lost cause. Companies just have different priorities and in order to push change, you just need to employ some empathy and stakeholder management. Try turning the abstract concept of a rebranding project into some measurable outcomes, such as:

Creating the human experience around interacting with all our products

Ensuring consistent execution of our brand identity through all platforms

Vetting other team’s material for design in a compliance-like process

Increasing throughput of other teams through shared branding resources

Publishing content that promotes our brand as a thought leader in design

To become a company that’s valued like Dropbox, Google or Facebook, your company can’t comprise anywhere on quality. Take Slack as an example  - their core product was built to rival giants like Skype, Hipchat and Yammer.

But Slack didn’t just make team productivity viral… they made enterprise software sexy. The reason people flocked to them is because they care about everything equally  - the way Slack runs their marketing, engineering, operations and design departments are what every startup aspires to.

“Over the past couple months, their competitors have caught on. They’ve all started using casual copy and trying to bone up on design, but it’s a little like your uncle trying to do the macarena. It’s too little too late. Everyone has picked their robot sidekick. Slack has stolen the show.”

The reason Slack is defensible is its attention to detail. While the product itself is relatively simple, the design aesthetic, brand and user experience is unparalleled. You just can’t clone that.

The number one thing that attracts companies into backing an idea is seeing it work for others historically. Here are some other examples of successful standalone, enterprise design teams that are incredibly successful:

Dropbox’s focus on minimalist design is one of the keys to its success while they were coming up against Google Drive and Box — ease of use is the reason for their customer loyalty. Dropbox gets press coverage purely based on how great their design is and, love it or hate it, their recent Warhol-style rebranding project is stirring up discussion all over the internet.

Many Dropbox Design alumni are world-famous designers, such as Ryan Putnam, which led the public to view Dropbox as an industry leader in design. Their Design team was previously led by a highly-respected designer - Soleio -  which helped them attract top talent for their creative teams.

While Facebook are far from a industry leader in design for their primary product, their Design team has been making waves recently by creating content for the design community. Julie Zhuo, the VP of Design at Facebook, has become a thought leader in Design for her blog which discusses the designer mentality, making a very good impression for Facebook.

Facebook have also started gaining design-related publicity based on their UX research. They’ve realised that having a standalone team dedicated to design  - brand, microinteractions and accessible interfaces -  attributes to what makes customers stick.

Intercom’s bold blog design created a statement and has made them one of the most well-known design / startup / marketing blogs on the internet, as well as making them a non-stop content marketing machine. The Design team run their own Design Blog with articles that get thousands of recommends every month, increasing lead generation and making them a thought leader.

Intercom’s Design team is very public on Dribbble, maintaining a design network of 3000 people and getting tens of thousands of views on their content.

Having a standalone Design team is incredibly valuable to any company, particular disruptive technology startups. Your product is everything however, as time is likely your most important factor to operate on, tasks like ensuring design consistency and reusable components are often backlogged.

What do Slideshare, Pinterest, Airbnb, Behance, Posterous, Flickr, Etsy, Instagram, and Tumblr have in common? Well, they are all successful design-(co)-founded businesses. Their ‘design’ way of thinking transformed their startups into top companies with millions in revenue.

Rewriting or copy/pasting the same components across our platforms will become commonplace and eventually lead to scaling and efficiency issues. Engineering leads are typically well aware of the effects of non-modular development but their deadlines prevent us from context switching to something that isn’t “mission-critical” for launching a new product.

In order to mitigate, consider putting a team together to create and maintain a cross-platform code-based styleguide that houses the common components for all your products. At Palantir, it’s called Blueprint. Atlassian has AtlasKit, Salesforce has Lightning. Basically this means that engineers on any product are able to construct the majority of new products like Lego blocks.

The return on investment for a brilliant, thoughtful design isn’t as clear to founders or engineers as a growth campaign or an API update. The impact of design is hard to measure which leads many engineers to doubt its value. But, with the rise of companies like Apple, Slack and Stripe that are design-led, we’re starting to understand the long-term benefits.

It’s all about perception and justification. If you can do a bit of research and some questioning, I’m sure you can find some solid reasons to convince your engineering team to be a little more flexible with their schedule. Make sure they understand that the few extra hours to polish are worth the effort, as they’ll result in a whole list of benefits.

As you can tell, we're huge advocates of brilliant branding and product design at Jellypepper. If you'd like us to help out with something, get in touch! We're always looking to work with great people on great products.

Convincing your company to invest in product design and design teams can be tough, so here are a few arguments you can use.

Creating defensibility through design

If you’re new to the world of digital product design, a design language is a set of rules and patterns that guide consistency and cohesion when designing a product interface. As such, a design language system (or just design system) is a set of tools or instructions to assist creatives in actually implementing the visual language.

Design Systems have done a lot to mature the practice of digital product design. The merits of building systems are clear, but the proliferation of design systems surfaces the fear that we won’t be designing thoughtful experiences. Rather, we’ll simply be connecting predesigned blocks of content and applying preset behaviours that may or may not be appropriate to the solve the problem at hand.

The opinions of design systems range from a necessary evil to a foundation of great design, but the first and most obvious problem some designers have with them is idea the belief we’re losing our core as designers by distilling the concept of design into a series of prebuilt, rigid blocks.

But here’s the thing: systematic and reusable design is not even close to a new concept. The block model for designing websites has been around for quite a while. Ever since the release of Startup Framework 4 years ago, marketing designers have been looking for an easier way of constructing landing pages. Founders and companies started looking to buy component kits instead of hiring designers and over time, the complexity and aesthetics of these kits improve. Some of the better web UI kits can be found on Great Simple.

It’s been the same way for code — SMACSS was released around the same time and has paved the way for all manners of methodology surrounding modular and scalable CSS, most notably Atomic Design by Brad Frost. Meanwhile, the JavaScript community has started creating libraries for building reusable components, like React or Polymer with CSS Modules, as a way to proactively guard their front-end codebase against inconsistencies.

The fact of the matter is that we’re moving to modular, reusable design regardless of whether you think it’s a good idea. The benefits of design systems become more apparent with scale and at this point, not believing in the future of design systems is just a nice way of saying you love technical debt and scaling issues. It’s all just a part of trying to become more efficient.

Having said that, much of a design system should be “predesigned blocks with preset behaviours” — it’s important to remember that with design systems, you’re designing for a product suite at a component level. Your buttons and inputs should have the exact same functionality.

Design systems at their best should actually promote more creativity - they’re about helping you focus on the bigger picture rather than re-laying the foundations every time. Good design systems are catalysts for consistency, not an immutable list of commandments.

Furthermore, creating a design system for your product is no way a static or one-time process - breaking down your product suite into components allows for greater focus on the individual elements that support your platforms. Isolation of components allows for evolution through deviation, constraints through principles and allows you to put more effort into the “secondary” attributes such as security, accessibility, reliability and trust.

Just take a look at Google - they’re experimenting and A/B testing wildly experimental new concepts so they created Material Design to create the groundwork for their experiments and products. Every time they learn something about their components from their use in the wild, they come back and implement a fix or a new feature in the material design library.

That being said, a designer’s ability to be creative with a design system depends wholeheartedly on the culture of the workplace — design leads should create an environment where designers are encouraged to experiment beyond the boundaries of their design system to find better alternatives.

It’s also important to remember that design is a funny word. Most people (junior designers included) don’t understand the true meaning of design. Once again, Steve Jobs has done the best job of summing it up:

Most people make the mistake of thinking design is what it looks like. People think it’s this veneer — that the designers are handed this box and told “make it look good!” That’s not what we think design is. It’s not just what it looks like and feels like…. design is how it works.

So have a think about how the components of your designs system tie in to things like your user’s intents, goals, activities and behaviour. Look at your data — how are customers using your components and does it reflect that in your interaction design? How effectively do your components translate to code and to what extent are they scalable, modular and granular? Most importantly, what do these components feel like when you use them? Have you thought about accessibility, reliability and security?

If you’d like to learn more about design systems, Alex Pate maintains a list of design systems published by companies and how they stack up.

How does the growth of systematic and reusable design systems in product design impact our creativity and freedom as designers?

The industrialisation of digital product design

Writing a brief can feel a lot like regurgitating facts to fill out a form; a routine part of birthing any project. Everyone has a different format, but all creative briefs pretty much do the same thing—they align everyone on the same vision. The success of the final product pretty much hangs on the strength of this alignment. Don’t believe it? Behold what can happen when nobody is on the same page about a chainsaw:

There are many more jokes on creative briefs, and it all stems from the fact that it’s often hard to articulate what you want in a design. In the case of a website redesign, there’s going to be a lot of hands on the pot, each wanting their own personal flavour on the sauce. What a good creative brief can do is tie objectives with design decisions together so tightly that nothing arbitrary can find its way into the final product.

The creative brief is a godly document that answers all questions before anyone even thinks them. (Just kidding, that’s impossible.)

At the very least, a creative brief can pull everyone involved into the same headspace. But first, there are essential questions your brief needs to answer before you approach a developer. It doesn’t have to be perfect, but it should provide some realistic parameters to your project. Here are the seven mysteries you need to think about:

It goes without saying that your company’s identity figures into the redesign strategy — but don’t go thinking you can get away with a bare-bones list of products and services.

The most important thing to capture is your big idea and vision. Not all design ideas can be implemented on the website, and the ones that make it past the cutting board should serve your company’s big purpose.

Twitter’s redesign, for example, made the platform easier to navigate especially for new and casual users. According to its co-founder Biz Stone, the purpose of Twitter is to “serve the public conversation,” so the design update rolled out Explore on the menu panel and advanced filters for Search. The idea is to make it easier for users to find and interact with the communities and personalities that interest them the most.

If Twitter’s redesign was for people engaged in public conversations, who is your redesign for? Whose problems are you solving? Look for that sweet spot between your company’s goals and your customer’s needs — that’s the piece you need right at the top of your brief.

Ideally, your redesign objective is not all aesthetic.

There are many botched facelifts in the world of redesign and rushing in for a new look empty of meaning will get you cursed with the same fate.

At the core of a website redesign is the objective to make the exploration experience easier for the user. Design is problem solving. In fact, only a burning pain point should power a redesign project. Without it, the money, manpower, and the three to six-month labor needed for the complex project won’t be worth it.

When Mailchimp redesigned their website, the update came with huge brand changes. The email platform has evolved into a marketing all-rounder and the old identity didn’t quite embody the new features anymore. But beyond brand consistency, they also identified an insight Mailchimp’s users are perpetual students of marketing — much like the company. Hence, Mailchimp revamped their resources and support channels, and capitalized on friendly illustrations to express accessibility.

Do you have issues with your current design or is there something you want to achieve with the redesign?

3. What should your website look and feel like?

When building a house, you don’t start with the design of your tiles or the color of your kitchen cupboards. You start with a blueprint, and from there determine what kind of tiles and cupboards would accommodate the design and use of the building.

In much the same way, a website should start with a sitemap. This is where the project begins to take shape in a tangible draft. The sitemap is a primary point of reference from which you can project a realistic budget and timeline.

Having data on how visitors navigate your site is ideal here. You’re improving the navigation of your website (on both desktop and mobile) and the findability of your content for visitors. Making it easy for them to engage with your content can boost accessibility and SEO.

But be warned: Changing your IA or information architecture too much can cause your high-ranking pages to get disconnected from search engines. This is one of the reasons some developers consider redesigns harder than building a site from scratch — they have to work with the existing IA.

Speaking of accessibility, the visual choices you make has everything to do with it. Randomness isn’t a known element of good design. For example, the World Wide Web Consortium (W3C) recommends a minimum contrast ratio of 3:1 for large texts, otherwise it would be hard to read for folks with low vision. Guidelines like this can be challenging for designers because color choices can easily fall outside a brand’s palette. To solve this very problem, the web design vanguard Stripe actually had to devise a color system for their own website.

If you’re really having trouble with the design, it could be that your company's brand isn't versatile enough. Aligning your web development with a brand update might be your best bet.

You’ve likely encountered a number of websites that looked good and felt good to navigate. This is the perfect time to comb through them and analyze their content, features, and integrations. The key is to bookmark and take notes — this will be useful when you want to describe ideas for your new website.

Note down things you dislike too, for additional perspective on which possibilities are good and which ones are off-limits.

4. What are the functionalities of your new website?

Not only is it open 24/7, your website can also handle multiple functions. But only if you will it. A good design is wasted on a website that only functions as a digital brochure. That’s why blogs for content marketing and landing pages geared for SEM and PPC are now staples in any online real estate.

When thinking of features, you have to consider your tech stack — the softwares and integrations that support and power your website’s capabilities. The more features your website has, the more complex the tech stack.

For example, we wanted branded case studies for the Jellypepper website. The idea to visually express the unique personality of each case study can’t be executed with a traditional content management system like WordPress. We needed something that allows for more flexibility with art direction. Enter the headless CMS platform Prismic, with its customisable components (a.k.a. content slices).

That’s just one idea for content management. Another is to cross-publish on Medium using canonical URLs so you don’t have to worry about duplicate content issues.

Similar considerations will need to be made for your tracking method (Google Analytics with a dash of Facebook Pixel?) and email marketing (Mailchimp or Intercom?), just to name a couple.

Redesigning is one thing, producing content for your website is another. If your website has been around for some time, you might even have a store of content ready for migration. The ones with rank must retain their positions in Google, of course.

Salvage what you can from the old website, but also consider that  you might want them to be updated. A refresh usually requires new copy and imagery. Organize these in an intuitive filing system and your developers will thank you.

Time and cost overruns are all too easy if all of the previous items aren’t discussed in realistic terms. Give your developers an idea of what they’re working with, and be prepared to make adjustments based on the expectations outlined in the brief.

Future-proofing anything tech is tricky. Nobody knows what will be in or out in the next few months — not even Google. Still, you have to try. Discussing what your plans are post-release can only bring positives to your project. If money is tight, you can dole out releases based on your budget, or your developer can create crucial adjustment space needed for future plans.

Your website redesign brief doesn’t have to be perfect, but it does need to be thorough. It also needs to carry a spark. It’s easy to fall into the beat of BAUs and fill out project briefs with cold hard facts; but sometimes it’s only the spark of a vision that can lead to something truly inspired.

A few tips to create the perfect brief for your website redesign that captures the essentials and your objectives.

Stories, updates and ideas on Design

Gamification: A Growth Technique With Proven Results

Design Sprints: The 5-Day Process for Rapid Ideation

Pure functional design and its role in products

Creating defensibility through design

The industrialisation of digital product design

The 7 questions your creative brief should answer