We think, learn and love to share. Read the latest insights from our team and let us know what YOU think
I want to read everything
As a designer, I’ve learned quite a lot from my time spent working with developers. I’ve come to realise that there are some things that I can do to make the relationship between myself as a designer and the development team I am working with a little less stressful.
It’s easy to see why development and design are a quintessential duo. They’re two sides of the same coin – each working in tandem, but focusing on different deliverables of the same product.
Although both skillsets are required to build a product that meets the needs of the people that will be using it; in a practical sense, a developer and a designer do not always work side by side, but rather one after the other. For example, a designer needs to consult a developer early on in the process. This is ideal not only for establishing relevant constraints, but also to ensure that what the designer has in mind can, in fact, be built.
This is not to say that they work completely isolated from each other, but rather simultaneously helping one another during the process, ensuring that each other’s knowledge helps inform the solution.
In this sense, designers and developers work together like a tag team: each focuses on their own task before passing off (or handing over) to the other.
There are many challenges that occur when developers and designers work together and it’s not always smooth sailing. Like with many things in life, communication is the most vital key to the success of the relationship, and the product in question.
The earlier a designer sounds out their ideas with the development team, the more prepared both parties will be for the task at hand. This will better enable the development team to be able to accurately predict and prepare for any technical hurdles or problems the designer might not have thought of.
Similarly, a developer cannot begin building a product without first having an in-depth discussion with the designer. If this discussion does not take place, there may be a disconnect between the designs and what is built, assumptions being made and functionality missed, which may lead to more iterations and extended build time.
Without the developer, the designer would merely have theories, research and ideas for optimising the product. Conversely, without the designer, the developer would have a product that doesn’t fully meet the needs of the people using it.
As a designer, you’ll often hear things like “learning to code will enrich your design work and make you a better collaborator”. While this statement may be true under certain circumstances, there are various other ways to consider development while designing.
Don’t get me wrong – as a designer, learning more about the development world can be interesting and empowering. But just like the design world, the development world is equally as diverse. You can find yourself going down many rabbit holes while familiarising yourself with the different tech stacks, which can be time-consuming and overwhelming.
Therefore, as a designer, a more practical and efficient approach is to learn from your developers. This can be achieved by keeping communication at the forefront of the process, rather than trying to become a developer yourself.
“A designer learning how to code, or a developer learning how to design is like having a washer-dryer combo – neither end up being much good at either task. It’s better to have both a washer and a dryer. That way, each one can focus on their respective roles effectively and efficiently”
BL. Coskey, 2022
There are a number of tools that were created in order to enable designers and developers to work more cohesively. These tools help to ensure that developers and designers stay on the same page, so to speak – it enables their collaborative efforts to function more practically and effectively.
For example, Storybook is an open source tool for building UI components and pages in isolation. It streamlines UI development, testing, and documentation. There are also a number of component libraries, like Mantine, that offer the chance to standardise development, reduce code duplications, improve collaboration between teams, and drive scalability. A designer can ask the development team for access to any available pre existing component of the project. This way, the designer can more accurately plan their strategy. It can also serve as a powerful catalyst for the designer’s inspiration.
As designers, we are driven by curiosity, coupled with an enthusiasm to solve problems. The more insights you uncover, the more problems you’ll identify — and the harder it becomes to settle on solving just one. Even projects with a well-defined problem statement can be difficult; as you dive into it, you want to solve every single problem that arises in user and stakeholder interviews. But there’s only so much time available, and there are only so many problems that are solvable within the scope of a particular project.
It’s inevitable that you’ll uncover new pain-points along the way, but you can’t change tactics every time this occurs. The challenge lies in staying focused, and your problem statement will help you to sustain this focus.
Right at the start of any project, it’s generally best to take the time to define your problem statement. A good problem statement focuses on the user, and their needs (a rule of thumb is to avoid using “we” when framing your problem). A good problem statement addresses just one or two of those needs. Setting a manageable problem statement will help keep your wandering eye in check when you discover shiny new problems along the way.
As designers, we are continuously looking for ways to refine the experience of our users. Designing with consistency and purpose can help us to achieve this. However, it is not only important for the user — this also creates an effective workflow for designers and developers alike, and may even reduce the development time on a project and prevent scope creep.
The best way to avoid discord between design and development is to communicate early on in the process, and frequently. Involve the developers as soon as possible. This way, they’ll be able to identify (and hopefully resolve) any potential issues long before the handoff phase.
Sharing knowledge is also key – while you don’t necessarily need to learn how to code, it’s worth taking the time to understand how the developers work, as well as the challenges that they face.
I think that in terms of design, we can focus on more than what the user needs and their experience. This is, of course, important and the main reason why we design, but we can also focus on the needs of the team, and how effectively the project can be developed overall. When your team lacks effective communication, efficiency and consistency, these challenges can affect how the project is developed, as well as the user’s experience.
If you’d like to find out more about our capabilities and what we can do for you, or you’d like to join our team, get in touch.
Want to learn more about Storybook? Here’s Storybook in 100 Seconds.
If you’re interested in component libraries but are not sure where to start, click here.
Naing joined us from having completed an MBA at Queen’s University, Belfast and worked in the digital transformation team of a local bank in Myanmar.
What led you into dev work?
It would be my passion for technology. Even since I was young, I loved playing Super Nintendo, solving puzzles, and dismantling electronics. This momentum as a young kid accelerated when I started college – specialising in hardware and networking. From there, I begin to see the correlation between hardware and software. So, for my bachelor’s, I transitioned to Software Engineering – to further study and understand the overall architecture of applications. I ended up with a BA in Software Engineering from the University of Canberra and a Diploma in Networking from the Canberra Institute of Technology. I guess all the decisions I have made, led me into the tech industry.
What’s your role at Den?
I am currently working as a Digital Product Owner. My current role allows me to be a part of a bank’s digital transformation journey – providing expertise in gathering business requirements, client management, delivering products and empathising with customers in their digital banking journey to solve their problems at hand. I am also looking forward to working in other different areas of products.
What’s been your best work experience – and your worst?
The best experience I gained was the satisfaction of delivering loan services (hire purchase, micro-loans) for a bank that was taking a customer a month to onboard, into a 15-minute process. This project taught me a lot, especially to consider different perspectives of teams since they are much more involved in the ideation and creation of the applications. It has also provided me with an insight to break down rigid processes to become more efficient and valuable to client organisations.
The worst? To not be able to meet face to face with customers and peers because of Covid. It’s a bummer.
What would you like to change about online banking services?
I would love to see more external integrations and collaborations between FinTech companies and traditional banks to provide customers with exceptional services, e.g., connecting analytics to a banking application to understand spending habits and predicting behavioural patterns. (It’s a bit nerdy, I know.)
What do you like to do to relax away from a screen?
I like to travel a lot. It makes me happy to experience new scenery, food,
and cultures. Mussenden Temple in Northern Ireland is a favourite spot. I have also been meaning to take up a sport since I feel like I’ve been spending too much time in front of a screen.
And the best noodles in London?
Marugame Udon
What is headless and what makes it so interesting? Systems like WordPress and Shopify are monolithic – they are self-contained. The backend is tightly coupled with the front end and to build a site with them means you have to work within the parameters and limitations baked into that system.
If you want to build a site with those systems you have to know the platform.
A headless system however, doesn’t have the same limitations. The back end makes its content available through a set of APIs which a front end can be built around.
The head is the presentation layer – be that a website, app or some other service and the body is where your content is managed. That could even be multiple places, you might have a headless Content Management System (CMS) for your blog posts and a headless ecommerce system that powers a shop on the same site.
In fact there is nothing to stop you blending content from several sources into a single product page – you can choose from the best tools to meet your specific needs.
The same content can then be used across multiple presentation layers – that could be multiple layouts, devices, channels, and applications.
Separation of concerns – being able to develop a front end separately from the back end generally means a quicker turnaround, especially when mock APIs (mock data responses to requests from the front end) can be used while the back end is being put together. Teams can work in parallel or can focus in on specifics without having to wait for milestones to be reached.
Developer experience and resourcing – a front end team can build a site or app without ever knowing or caring what the backend is. They don’t need to be WordPress specialists or understand Shopify to build a site, they just need to know what the APIs are. This means they can work across whatever project needs them.
Flexibility – content might only be used on a website to begin with but if that ever changes all that’s needed is a new presentation layer – the content will be adaptable to wherever it’s needed.
Scaling and infrastructure – a monolithic application will usually require one or more servers and resources which are hard to scale. You’ll either end up paying for resources you don’t need or find you don’t have enough when a spike in traffic comes. With headless it’s much easier to design a solution that can scale up and down automatically.
Headless isn’t the perfect fit for all scenarios and isn’t suitable for every project.
Costs can become complex and unpredictable. You could end up using several systems, each with its own cloud-based services and most of which will have individual costs attached. If you’re paying for computational resources based on usage and you see a huge spike, you can expect to be billed accordingly – which can sometimes be a nasty surprise.
Systems like WordPress, Shopify and Magento will have a rich and powerful ecosystem of plugins that can quickly bring complex functionality to a site. Headless requires you to build from the ground up and even with components that can be used across projects, you’ll usually need to build them yourself from scratch.
Many would argue that this is a benefit rather than a drawback but perhaps not by clients who have a limited budget or timeline or who want a proof of concept.
Headless is a great option if the website or app you’re building would be restricted by a monolithic system or if it’s likely that the content will need to be used across several channels. It’s also a good option for sites that are likely to need infrastructure that can scale quickly.
If you’re creating something which is likely to remain fairly static and doesn’t require a multi-channel approach then traditional systems are still a very good choice.
If you’d like to find out more about our capabilities and what we can do for you, or you’d like to join our team, get in touch.
What led you into design?
For as long as I can remember I was always drawing, and on finishing secondary school it became clear that the road ahead would be shaped by sport or something creative. I knew little about design or what the career options were, I just had a knack for making things look half decent with a pencil or a paintbrush. I decided to embark on higher education and hone my skills. The journey since has been varied and fun. I’ve met and worked with some amazing people, have seen trends and technology come and go but I’ve been lucky enough to gain enough experience in the many different facets of design to forge a career in an industry I love.
What’s your role at Den?
My role has evolved as the team has grown. It’s taken some getting used to but I made the decision to down my tools and focus on how we go about our work and the talent that lives within the team. These days, the majority of my time is spent providing oversight to all things creative, building a team to deliver amazing results, and ensuring we are running the right process, with the right designers whilst helping the team navigate any challenges that may arise along the way. Apparently, I’m referred to as ‘design dad’ which is a fairly good description of my role these days.
What’s been your best work experience?
Visiting a barn in Bradford to see snow being made. As crazy as it sounds, I was there to test and choose a particular variety of snow for a winter ad campaign. I came away learning that they were all a by-product of paper manufacturing and that all my movie white Christmases were a lie. Then came the shoot itself, getting to wear a ghostbusters style getup to blow snow all over a stately home, a vintage car and filming snowball fights in the middle of summer.
And your worst?
Clearing up the snow…..
What single product do you think is most in need of a redesign?
I recently managed to erase all of the visual cues for the controls on the cooker hob (don’t ask). You would expect after 6 years I would know which dial controlled what burner, but it’s like I have never used the thing before and relies on trial and error to cook my kids a hot meal. I now have first-hand experience of bad natural mapping (the relationship between a control and its resulting function) as defined by Don Norman and am now on the hunt for an oven that solves all my culinary problems.
If you’d like to find out more about our capabilities and what we can do for you, or you’d like to join our team, get in touch!
I have spent my whole life, or for as long as I can remember, trying to find ways to improve and streamline my ways of working, both in my professional and personal life. To give you an idea, I have over 200 apps on my phone, from shared calendars to flower care apps and even recycling guidance apps, all organised into folders to get me through the day.
This might sound like an overshare but it leads me nicely into plugins. I have a handful of Sketch plugins that have streamlined my workflow so much that I now couldn’t imagine living without them (without being too dramatic). The benefits have been endless, and if you are looking for a more efficient way of working and, let’s be honest, an easy and fast way to get things done, then read on.
Below are my 12 most used plugins for Sketch in no particular order. Disclaimer: I tried but couldn’t narrow it down to 10 and, there may be more recently released plugins that are better, but since I’ve been using them there has been no need for upgrading, so this is my list.
Download here
Price: Free & Paid version from £28
Think of Runner as a spotlight search for Mac users and a PowerToys Run for Windows users, but 100 times better. It is a multi-purpose plugin that allows you to create and apply Shared Styles, install and run other plugins, insert Symbols and much more by running Sketch commands from your keyboard. To make this plugin even better, it allows you to customise it so it works best for you. Try all features for free for 14 days and continue to use Run and Install features forever with the free version!
Download here
Price: Free
Automate is an all-in-one plugin with over 200 features, often described as “the Swiss Army Knife of Sketch plugins”. It is perfect for artworking with commands that make it easy to clean up your files and a real time saver that allows you to view and manage layers, styles, artboards and much more. In fact, Automate has the functionality of some of the plugins in this list but I find it easier to have some plugins specifically for one use. Some of my favourites include the library management options and the option to find and select anything based on pretty much any parameter; this really is the bee’s knees of plugins.
Download here
Price: Free
If you’ve used a text editor before, you will know how useful it is to find and replace text. This plugin has many advanced options; it enables you to search for instances of particular words or phrases in the text in selected layers (and everything contained within), then swiftly replaces them.
Download here
Price: Free & Paid version €25
The Merge Duplicate Symbols plugin targets symbols, layer styles, text styles, and colour variables, allowing you to merge them based on three sets of criteria: same name, similar UI, and selecting either from a list or with a click. All of this happens seamlessly by replacing all other symbols and their instances with the one you chose to keep, and the most impressive part is that it will do all of this within your whole sketch file and your linked libraries!
Download here
Price: Free
Keeping files organised is essential, especially when collaborating with other designers. Rename It helps keep your Sketch files organised and allows you to rename multiple layers at once by selecting them and using a single shortcut. It includes options to rename by sequence, selected layer(s) and width and height. This plugin eliminates possible errors and inconsistencies when renaming layers manually.
Download here
Price: Free
It might seem obvious, but Sketch’s lack of spellcheck makes this plugin a must-have. You can run spell check on all text layers on the page, and the panel allows you to replace the misspelt word, add it to your dictionary or ignore it.
Download here
Price: Free and paid subscriptions starting at $60 a year
Today, developing accessible products to improve the accessibility of information on the web for people with disabilities is crucial and Stark makes it that much easier. Whether you are a designer, developer or product owner, accessibility must be at the forefront of your process. With its vision stimulator, focus order and contrast checker, Stark makes creating accessible products that bit easier. Read more on accessibility and design in our blog here.
Download here
Price: Free
This plugin is a simple one but one of my most used. It locates all instances of a selected symbol and allows you to see overrides, select all on a page, and jump to its location, making it easy to find what you are looking for. For more functionality with symbols, Automate allows you to select all instances of a symbol, to rename and replace batch symbols.
Download here
Price: Free
Not to be confused with the functionality of ‘Find and Replace’, this plugin updates all layer names to match their master name and can be very helpful when tidying up your files, especially after the renaming of symbols and styles. It is effortless to use and has many options with exceptions, making it great for keeping your files organised.
Download here
Price: Free
Symbol organiser is a great plugin that lets you sort your symbols by organising them based on parameters you set, such as title style, layout direction, spacing and groupings. It aligns and arranges the Symbols appropriately and can also help remove all the unused Symbols from the document.
Download here
Price: Free
Craft by Invision is a plugin that allows you to easily sync your designs with InVision and all its tools, including prototypes, freehand and the DSM. Its features include creating cloud-connected libraries to share with your team, building high-fidelity prototypes, collaborating in real-time and handing over designs to developers to produce pixel-perfect designs.
Download here
Price: Free
A simple plugin that does what it says on the tin! Whether you are a neat freak and want to keep your files clutter-free or you are at the artworking stage of your project, use this plugin to remove any unused layer and text styles. The plugin will display all the unused styles, and you can select which to remove and which to keep.
I initially tried to narrow this down to my ten most used plugins, but with over 30 to choose from, that proved to be difficult, so to close off, I would like to mention some that did not make the list but are definitely worth checking out too Align Artboards, Lazyboards and Shared Style Finder.
If you’d like to find out more about our capabilities and what we can do for you, or you’d like to join our team, get in touch.
In this talk with Jonathan, we’re taken on a journey to far-flung corners of the world in his rundown of work experience to date, we speak a bit about his role at Den, what he’s responsible for and what he hopes to achieve here.
You’ve had a really interesting career so far, can you tell us a bit about you and your journey up to this point?
I loved working backstage in theatres but didn’t think that would give me the travel opportunities I craved (I was wrong!) – so I looked for a skill that related to my favourite subject in school, biology. I liked being outside and around water and found aquaculture. After 3 years at agricultural college and work experience as a research assistant on lobster and halibut farming in Scotland, I joined VSO (Voluntary Service Overseas) and got a job running a consultancy service for 2 years, advising farmers on building fish ponds to help feed their families in a remote corner of Tanzania.
After that I went backpacking, taking the Trans-Siberian train to Beijing then around China to Hong Kong. I loved Hong Kong’s mash-up of city, mountains and sea and wanted to stay but there were few aquaculture opportunities so I returned to the theatre. I worked for the Hong Kong Ballet Company and then as an events production manager on fashion shows and product launches as well as with Pavarotti and the Moscow State Circus. That paid for more backpacking through Java and Borneo.
A chance meeting with a French entrepreneur making ballet shoes led to 5 years manufacturing and marketing his designs. Next, another chance meeting with a landscaper who’d won the contract to build an artificial rainforest and lost city at the Beijing aquarium led to 2 years there as his project manager and then more PM work in museum exhibit design/build back in the UK. Returning to China I was a researcher and writer for an urban design company before meeting a British theatre design company for whom I set up and ran their Shanghai office.
Later, while a stay-at-home dad in London, I worked on immersive theatre spectacular You Me Bum Bum Train and taught myself coding, publishing some apps and an immersive VR experience.
Finally, I was able to bring this all together as a consultant to the UK government’s Department For International Trade, developing a strategy to sell UK creative expertise in immersive experiences, both digital and physical, to museums, attractions and shopping malls around the world. Most recently I worked for a startup reducing carbon footprints in the art world – and then joined Den.
As Creative Consultant, can you tell us a bit about your role at Den?
My role is in business development, looking both long and short term at getting Den noticed off the back of some of the great work already done and spreading the net wider to find new opportunities in new areas. I’m also engaging with Elixirr Consulting, adding ideas from the world of immersive experiences to some of their client pitches, to which Den can then add their digital design and branding magic.
What do you hope to achieve in your role here?
The work the team has already done on e-commerce sites like Buster & Punch, Nourish, Jealous etc gives us some great sites to showcase and demonstrate that we can deliver more of the same – but bigger and to a wider range of clients. Dezeen is a groundbreaking piece of work in reducing the carbon footprint of a content-heavy site. This is right in the zeitgeist and I’m very interested in how we can do more of this. And of course, whatever else comes our way and looks like a fun and challenging project for the team.
If you’d like to find out more about our capabilities and what we can do for you, or you’d like to join our team, get in touch.
Research makes up a large part of the UX phase of a project and depending on the goal of the research, we adopt different methods. Two commonly used types of research are generative and evaluative. Let’s have a look at what they are, why they’re useful and when we use each.
What is generative research?
Generative research seeks to understand users as humans, not simply as users of a product. It hopes to understand their daily experiences: their worries, habits, frustrations, opinions, what motivates them, what doesn’t etc; it ‘generates’ rich information about the humans using your product, unearthing the why behind their behaviours. Common generative research methods include interviews and focus groups. Generative research is also sometimes known as discovery, exploratory or foundational research.
Why is it useful?
Generative research is useful because by really understanding our users as people, we can identify true problems and pain points. From these, we can then find opportunities to innovate and improve.
When do we use generative research?
Generative research is most useful early on in a project during the discovery phase when very little is yet known about the user.
What is evaluative research?
Evaluative research is used to test an existing solution to see if it solves the problem and if it is easy and enjoyable to use. In short, it is used to assess how well something is working. Common evaluative research methods include surveys, guerrilla testing, usability testing and A/B testing.
Why is it useful?
Evaluative research is useful because it allows us to put solutions in front of those that will be using them, early on in the process. By doing this, we ensure the solution is designed and refined to truly meet the users’ needs and expectations.
When do we use evaluative research methods?
We begin introducing evaluative research methods once we have a solution (or sometimes a number of solutions) we think might work and want to begin iterating in order to refine and improve it. We continue carrying out evaluative research throughout the iteration phase and often do a few rounds of it.
In summary, both research methods are extremely valuable and we use both extensively in the majority of our projects. While the methods have different goals and should be used at different points in the design process, one thing is true for both: they allow us to create products and solutions that people need and enjoy using.
If you’d like to talk to us about our UX process or just more generally about how we design and build digital products, get in touch.
2021 has been a big year for rebranding. Amidst a whirlwind of change, companies have been forced to continue to adapt, take new directions, and appeal to an audience whose lives have also been caught up in the whirlwind that is the pandemic. In the face of such turbulent times, it’s not surprising the number of companies that have undergone rebrands is high. There have been many, some have landed better than others, and in this article, we have rounded up a few of our favourites. In no particular order, and by no means exhaustive, let’s begin…
Inter Milan
One word to describe Bureau Borsche’s rebrand of FC Internazionale Milano (AKA Inter Milan)? Slick. In an effort to promote itself beyond sports and to appeal to a more international and youthful audience (not to mention that Italian powerhouses AC Milan and Juventus also underwent a similar process recently) Inter Milan revealed a new identity earlier this year, including logo, colours and typeface. The new logo, a simplified, sleeker version of the one designed by painter Giorgio Muggiani in 1908, has dropped the ‘FC’, leaving ‘I M’, based on the English ‘I am’. The colour palette of black and blue – representing the sky and the night – has been made more vibrant, making it more suited for digital application. The rebrand wasn’t all-singing all-dancing, but rather a considered evolution of what was already a very successful identity.
Burger King
Burger King’s previous identity was staling (they hadn’t rebranded in over 20 years) and falling behind their biggest competitor, McDonald’s, who were/are positioning themselves as a healthy and conscious choice. The rebrand, designed by the in-house creative team alongside Jones Knowles Ritchie, was in part to try and improve negative perceptions of Burger King’s fast food – the food is now free from colours, preservatives and flavours from artificial sources and they wanted their diners to know this. Everything from the new colour palette, custom typeface, photography and tone of voice are inspired by the food and move away from feeling synthetic, artificial or cheap. It’s no easy feat rebranding an international company across all its touchpoints – packaging, uniforms, merchandise, restaurant signage and marketing assets – but we think they nailed it.
Mind
Attitudes towards mental health are changing and mental health charity, Mind, needed an identity that reflected this change. Led by London-based branding agency, DesignStudio, the refinement is careful not to digress too far from an identity that had already built so much recognition and helped so many. In order to make the brand even more accessible and relate to a growing audience, the new colour palette is broader, with a more vibrant shade of Mind’s original blue and three new bright colours; green, coral and pink, and the logo has been simplified so as to work better across digital. The hand-drawn illustrations, all donated by people at DesignStudio, celebrate difference and individuality, while the photography depicts people from all walks of life. The new identity has accessibility at its core, including a custom typeface, Monotype Mind Meridian, that is legible for those with visual impairments. Don’t know about you, but we’re here for it.
Pinterest
Earlier this year, Pinterest revealed a new “democratic and optimistic” identity. A collaborative effort between design studio, Made Thought, and Pinterest’s in-house team, the new identity is vibrant and fun, using collage to create an eclectic, immersive and dream-like visual world. The bespoke typeface, designed in partnership with Swiss type foundry, Grilli Type, is playful and full of personality, and the colour palette, well, there isn’t one. Reflecting the diversity of the content on Pinterest and each user’s personal journey, the palette is fluid and, using a colour palette generator tool, is generated based on the colours in a selected image. We’re not sure what a ‘democratic’ identity should look like but Pinterest’s new visual language is definitely optimistic and successfully avoids any tech company cliches; we’re fans.
Match
Dating site veteran, Match, released a rebrand – designed by New York-based studio Collins – that feels remarkably more grown-up; this was intentional and sets it apart from its right-swiping competitors. With its sophisticated imagery, a colour palette of soft pinks, blues and purples, and elegant typefaces Reckless and Beausite, the visual language makes the dating-process feel like it should be one to be enjoyed, rather than the anxiety-inducing experience other apps can make it feel (naming no names). The new identity is everything you’d want in the person you might find on Match; calm, unjudgmental, gentle and classy. Sign us up.
Hotjar
Hotjar, a tool that lets you see the online behaviour of your users, released a new look and feel, designed by digital design agency, How&How, that is more inclusive and empathetic. The rebrand included removing the flame from Hotjar’s logo, which closely resembled Tinder’s distinctive logomark, and replacing it with two lines that represent both the individual user journeys and human connection. The new typeface, Ambit, is inviting, friendly, clear and legible and the colour palette takes its inspiration from a flame, capturing the full spectrum of human emotion. The squiggly lines are what Hotjar call ‘trace lines’ and represent how people move around an online webpage. We’re not the only ones who appreciate the new rebrand, Hotjar spoke to their users to find out what they thought and one described it as “uplifting, modern and forward looking”.
Alipay+
Okay, so not technicallyyyyy a rebrand as Alipay+ is its own product that requires its own separate brand different from that of parent brand Alipay, but we couldn’t resist. Alipay+, in short, allows users to pay like a local wherever they are in the world, and the bold identity, designed by DesignStudio, is very fitting for such a bold vision. Did we mention they want to reach 2 billion users? To reach so many users, the brand needed to engage, and engage it does; it has a contemporary palette, a friendly tone of voice and is brought to life through 3D motion.
Standard Chartered
The challenge Standard Chartered presented to global creative consultancy, Lippincott, ahead of their rebrand was: ‘As a dynamic bank growing through digital transformation, how can we reinforce our prime relationship with clients around the world?’. No easy challenge. The rebrand may seem modest, a simple tweak to the logo, but the impact is big. By swapping the order of the logomark and wordmark, streamlining the mark, dropping the shading and brightening the colours, Standard Chartered’s new logo is immediately more powerful and recognisable across digital – critical for a bank that wants to reach users globally.
We had to whittle this list down to these select few, but there were many others that deserved a spot. Maybe one for another time. Call us biased, but in times of change, rebrands are not just beneficial but necessary.
If you’d like to speak to our branding team about how we could work together in the new year, we’d love to hear from you. Get in touch here.
These days, new technologies rarely arrive with a bang but the things you first heard mentioned last year gradually start to appear in your daily life next year – and that will certainly be the case in 2022. What we should be talking about for 2022 is the expansion of arena-scale virtual reality from multiplayer gaming venues and movie tie-in experiences to wider immersive cultural experiences for entertainment, events and cultural institutions. But we aren’t because of the resources required to ensure headsets are sanitised and because punters are still nervous about putting something on their face that’s been worn by seven other people in the past hour. Instead, we’re talking about less in-your-face technologies that are going to seep into our collective consciousness over the next 12 months.
5G
5G is a set of mobile communications technologies that give greater bandwidth and allow smaller devices to do more stuff and most UK phone networks now claim around 76 cities have their 5G services. We’ll all gradually migrate to 5G as we update our phones and tablets over the next few years. Data-heavy tasks that will benefit from 5G include mobile gaming, video and music streaming, AI, mobile AR (augmented reality – mixed digital images with actual reality, viewed through a mobile device and sometimes called mixed reality – MR), VR (virtual reality – an entirely digital environment viewed with a headset) and IoT (internet of things – devices that communicate through the internet).
All these technologies have huge potential to make mobile e-commerce a more interactive experience. Richer media delivered to mobile devices means retailers can better demo their products; delivering video demos, gamifying product browsing with 3d virtual stores to navigate, subscription selections with more immersive quizzes, improved real-world placement of products with AR etc.
IoT devices also benefit from 5G networks, bringing the retailer closer to the consumer and their user journey by gathering more data on them via their connected car, fridge etc. (more accurately pushing product suggestions) and more closely tracking supply chains and deliveries with RFID (Radio-frequency identification) tags that can indicate location.
AR
AR offerings will increase because they can be delivered more quickly to mobile devices and AR is more accessible for the consumer because it doesn’t require that device to be strapped to their face – as VR does. AR art installations, such as Unmoored by artist Mel Chin, will be able to load faster and at higher resolutions. Unmoored created an animation of boats in Times Square, NYC, floating at the expected sea level in 2100 if greenhouse gas emissions go unchecked.
Add to this the LiDAR scanner used in the iPhone 12 for the first time and the capabilities of AR are making a dramatic leap. LiDAR (Light Detection and Ranging) uses lasers to calculate distance and depth. It’s the same tech that self-driving cars use to spot pedestrians and cyclists. LiDAR maps the 3D space around your phone and can solve the issue of occlusion in mobile AR. This is when an AR digital object should appear partly hidden by an object in the real world. Now that Pokemon Go you’re chasing can hide behind a tree.
Sadly, the cool stuff 5G can deliver is now recognised as contributing to the current environmental crisis because high data transfer requires more energy, and if that energy comes from non-renewable sources it’s contributing to increased greenhouse gas emissions. Internet use accounts for 3.7% of global greenhouse gas emissions (ahead of aviation’s 2%) and if the internet was a country, it would be the world’s third-largest consumer of electricity. There are ways this impact can be managed and reduced on a site-by-site basis such as cleaner coding and minimising media file sizes (something we help our clients with) – and another new technology, blockchain, is being employed to help tackle some of the wider issues around global warming.
Blockchain
Blockchain is a type of “Distributed Ledger Technology” (DLT). We’ve heard of blockchain in relation to cryptocurrencies and NFTs (Non-Fungible Tokens – a way of owning the “original” of a piece of digital art). DLTs are all about trust and one place where trust is in short supply is carbon credit trading – a tool in the climate change battle and a growth industry, even before COP26.
A DLT is a decentralized database, across multiple nodes. A blockchain is a type of DLT where data entries are recorded with a cryptographic signature called a hash. The data entries are then grouped in blocks and each new block includes a hash of the previous one, chaining them together. The result is a trusted and decentralised ledger of encrypted information.
Carbon credits are a way for nations, organisations and individuals that calculate their carbon footprints to offset those emissions by paying someone elsewhere in the world to directly reduce an equivalent amount of CO2. A simple example is when an airline in Germany calculates the carbon footprint of your holiday journey from the UK to Spain on their planes and sells you carbon credits that pay to have trees planted in Guatemala which absorb that same amount of CO2. Equally, they could contribute to the cost of building a wind farm in India that replaces energy from a coal-fired power station or some other CO2 saving venture. Carbon credit trading is the mechanism by which that happens.
Carbon credits are largely voluntary and under-regulated, leaving them open to fraud. Trees are planted, harvested and re-planted, with new credits sold each time, even though the same carbon reduction has now been double-counted. Indigenous populations have been moved to make way for tree planting schemes, diverse natural forests have been replaced with mono-species plantations and solar projects have not been built to the capacity promised.
Blockchain technology can create encrypted, distributed, ledgers of CO2 measurements with data being input directly from IoT devices on a 5G network – at both ends of the carbon credit equation. Trusted carbon credits can be traded at a higher value with the income they generate doing what they’re supposed to do, creating industries that actively reduce CO2 in the atmosphere.
So…
New technologies will give us richer digital experiences in 2022 but can contribute to the problem of global warming. Other technologies are on their way to mitigating this but data transfer can be optimised and managed and somewhere there’s a balance point between the fun, useful, data-rich immersive user journeys that we want to deliver for our clients and managing that data’s negative environmental impact. Your mission for 2022 is to find that balance point and deliver it.
And regarding the metaverse… maybe in 2023. The VR tech needs to become more user-friendly and content design needs to move beyond an avatar that looks like the one you used to play Wii Sports in 2006.
OK, so I’ve gone a bit over the top on the puns in the title. I’ll stop.
It just struck me that something that is usually a deliberate branding decision – ingredient branding – has become part of the brand reality for many restaurant chains, without it necessarily being a strategically-led move on their part.
Ingredient Branding is a strategy where a component or an ingredient of a product or service is drawn to consumers’ attention and given its own brand identity. The component, or ingredient, builds its own brand equity, and its inclusion in a product or service offering should increase the value of the larger offering.
I recently took part in a panel discussion about the rise of delivery companies like Deliveroo, Just Eat and Uber Eats in the UK, and DoorDash in the US. We talked about the rise of dark kitchens and the fact that there is only really room for one winner in each geography. These companies are therefore engaged in a race to the top spot – it’s an all or nothing game. We even touched on the fact that the restaurant chains that each delivery brand manages to partner with, are starting to look like the keys to the kingdom.
What I didn’t think about at the time, and has only just struck me due to a current above the line campaign on the London Undeground by both Uber Eats and Just Eat, is that this growing trend, and these brands fighting it out, has turned restaurant chains into ingredient brands, whether they like it or not.
For those that aren’t familiar with ingredient branding, an example might help illustrate the concept; it’s usually synonymous with brands like Gore-Tex, or Intel Inside. You might buy a Mountain Warehouse jacket over a North Face jacket, not because you have a particular affinity with Mountain Warehouse, but because that jacket has a Gore-Tex tag hanging from the sleeve, and you believe that Gore-Tex is the premium waterproofing technology. So, you trust that jacket to keep you dry. The relationship between ingredient brands and the brands they partner with is symbiotic. In our scenario, Mountain Warehouse sold a jacket because of the brand equity of Gore-Tex but equally, Gore-Tex are entrusting their reputation to Mountain Warehouse by partnering with them. If that jacket fails, the buyer will lose the faith they had in Gore Tex and it won’t be a persuasive factor again. On the part of Gore-Tex, and of Intel Inside, this is their deliberate brand strategy. How else does a fabric technology, or a device component gain any brand awareness or equity?
Restaurant chains are a different beast altogether. They have strong, recognisable brands, with bright, often colourful signage out on the street, in our eye-line, as well as often employing TV, radio and above the line advertising campaigns. Some have smells we immediately associate with walking past their establishments (Subway), some have taught us to associate them with a uniform experience, simplicity and value (McDonald’s). Ultimately, they have built their brand story and controlled the associations we have with them. Until now.
On my daily commute, I noticed two campaigns vying for my attention – Uber Eats and Just Eat. And the focus of their campaigns? The restaurants they have partnered with. Uber Eats have at least come up with some copywriting that differs depending on which restaurant they are showing off – ‘When things get tough, the tough get Sushi.’ – Itsu, or ‘When your day is long, go footlong’ – Subway. Whereas Just Eat have gone with simply ‘MMMMMMM Leon delivered’, ‘MMMMMMM Coco di Mama delivered’ – you get the idea. The purpose of the campaigns is clear and simple – you have to order with us if you want food from these restaurants. Every new restaurant brand acquired by one of the delivery firms is another tick in a box in the race to the top spot. They are trading on the brand equity and loyalty built up in these restaurant brands, just as Dell does when they put an Intel Inside badge on their laptops. Equally, the restaurant brands are entrusting their reputations to these delivery brands. If your McDonald’s turns up cold and soggy will it affect your opinion of Uber Eats or McDonald’s more?
The move to partner with delivery firms was strategic for restaurant brands to the extent that if people were staying at home, they had to find a way to get their food in their customers’ hands to keep up with their competition. But it wasn’t strategically led from a brand perspective by the restaurant chains; they had to react to the changing market. We’ll have to wait and see what impact their delivery partnership choices will have on their brand equity, and who the winners and losers will be in the cut-throat world of food delivery.
If you’re interested in our approach to brand strategy and would like to talk to one of our team, get in touch.
If you don’t work in an agile development workflow, you would be forgiven for not knowing what a user story is. In this instance, it’s not a tale about a meanie using someone for their own gain, it’s actually about making sure that what is delivered by developers actually provides the value that a feature was designed to deliver.
A user story is usually made up of a few sentences, written in informal, non-technical language and explains, from the perspective of the end-user, what value a particular software feature will provide to the end-user. The end-user isn’t necessarily a customer, or external user, they can also be an internal user.
User stories often follow this simple structure:
“As a [persona], I [want to], [so that].”
[persona] – Who are we building this feature for? The team writing the user story should have a good idea who this persona is – not just their name and job title. In an ideal world, we’d understand enough about this persona’s wants, needs and frustrations so that we can empathise with them and fully understand the value they will get from the development of this feature.
[want to] – What does our persona need to do that this feature should help them with? It should only cover the end goal.
[so that] – Think bigger picture for this one – what does this small thing our persona wants to get done contribute to? What big problem is this part of the solution for?
User stories help to keep the whole team focused on solving problems for the end-user of the product they are building. They encourage a more creative, problem-solving, collaborative mindset – it’s more meaningful to solve the problems posed by a series of stories than to churn through a to-do list.
Often, once a client has seen the finalised designs for their new product, they can’t wait to see it start coming to life. Writing user stories can be time-consuming and requires careful attention. It’s a vital step to ensuring that the build goes well, but it can be tricky to convince people who aren’t in the know that this is time well spent. It’s also very easy for people who aren’t used to writing user stories to stray into describing parts of the user interface, rather than sticking to the end goal that we are trying to facilitate. When this happens, the user story becomes much less effective as a tool to drive creative solutions. Sometimes, user stories can get too big; if the timeframe for development for your user story is getting too big, it will need to be broken down into smaller stories.
At Den, we’ve always been very focused on designing and building with the end-user at the very front of our minds. We include user testing in every design process, and writing user stories means we keep this focus on the end-user running from design, all the way through the build, to launch. This means that we are always creating experiences that are wanted, needed and useful, rather than just what someone, or a small group of stakeholders, conjured up in a meeting room somewhere.
If you’d like to talk to us about how we design and build digital products just get in touch.
Dezeen is the world’s most popular and influential architecture, interiors and design magazine, with over three million monthly readers and six million social media followers. Earlier this year, EcoPing; a service that tracks website emissions, revealed the hidden carbon cost of browsing the site. By the nature of its industry, Dezeen is brimming with data-rich content; Over 750,000 high-resolution images, video files and interactive designs have all contributed to a richer browsing experience for its users. But this comes with a hefty carbon toll with each page load – approximately 19.32g of CO2 (10 times the average for a webpage). When extrapolated to account for Dezeen’s traffic in 2020, a year in which they achieved a staggering 110 million page views, the estimated CO2 produced for the year comes to 2.1 billion grams. To put this into perspective, it would require a forest with 96,600 mature trees to sequester the equivalent amount of CO2. It’s equivalent to the emissions generated by flying one person from New York to Amsterdam 3,130 times.
Software on its own doesn’t consume energy or emit any harmful discharge in relation to the environment. The problem lies in the way software is developed for use – and then in the way that it’s used. It runs on hardware and therefore is reliant on machines and the energy used to run them. For a website, data is transferred between the front-end (webpage) and the back-end (server). To retrieve information about a web page, the browser requests information from the server. The server compiles the necessary data routing it back via switches, DNS servers, routers and caches – each step requiring electrical energy to perform a role. The more requests and data transferred, the more energy required to load the web page and the greater its impact on the climate.
We’ve been working with Dezeen over many years to shape their site and digital roadmap. They set us the challenge of reducing their carbon footprint considerably by optimising the website’s performance, without compromising on the user experience, and the high-quality media assets required.
Working closely with EcoPing, we conducted benchmarking to identify the data-heavy features contributing to the site’s high energy consumption. Speed is inextricably linked to data transfer and carbon emissions. By doing work to benchmark the data transferred with each page load and its speed, we were able to build a clear understanding of where to focus our attention.
We identified three targets of optimisation:
Changes were introduced over the course of 12 weeks.
Two weeks after all code changes were implemented, emissions per page fell from 21g to 7.18g, a reduction of 66%. Furthermore, the average page load was reduced to 3.5s, a fall of 58.3%. This dramatically improved the user experience of the site. Although it’s too early to tell with the changes made at Dezeen, the improvements to the user experience as a consequence of the optimisation work carry significant benefits for the business’ bottom line. Research has demonstrated that even an incremental improvement of just 0.1s in page load time can generate significant benefits for conversions, bounce rate, lead generation and site referrals across a range of industries.
While the code changes implemented have drastically reduced Dezeen’s carbon footprint, there is still work to be done. We will continue to work with Dezeen to ensure the site is continually optimised and sustainable development practices are adopted moving forward.
Interested in finding out how we can help your business cut its carbon emissions? Get in touch here.
According to the latest estimates, around 15% of the world’s population have some form of disability, which represents a massive underserved customer group in most industries. In the UK, 1 in 5 people have a disability – this could be visual, hearing, motor (affecting fine movement) or cognitive (affecting memory and thinking).
Accessibility is a series of activities aimed at creating equitable digital products, focusing in particular on people with disabilities, the elderly and those affected by many other limitations.
Web accessibility protects your website against demographic changes and opens your business to everyone with an internet connection.
Historically, people with disabilities have had a hard time interacting with technology. Limiting access to technology based on disabilities creates discrimination and inequality of opportunity. Making the internet a more accessible and equitable place will benefit everybody.
Having an accessible website enables more users to have positive experiences with your brand and could potentially convert them into brand advocates, increasing your brand awareness through word-of-mouth. Read more about it here.
Globally, people with disabilities represent one of the most neglected segments of the consumer population, forming the largest “minority” in terms of spending power. In the UK, people with disabilities and their households have significant spending power, accounting for the disposable income of approximately £274 billion, which continues to increase. Read more about it here.
Accessible websites have increased conversion rates because they are more usable to a larger percentage of their user base.
Search engines will rank your website higher. Both Assistive technologies and search engines rely on machine-readable content, thus having an accessible website provides a natural boost to your SEO endeavours.
Web Content Accessibility Guidelines (or WCAG) were developed by the World Wide Web Consortium and represents an internationally accepted standard for web accessibility of sites and applications. From its release in 2008, the WCAG 2.0 principles and guidelines have been consistent and since then have only had additional “success criteria” implemented via the latest version WCAG 2.1.0
Given the rapidly changing technological landscape, companies should try and adhere to the latest version of the guidelines to offer an inclusive experience to all of their users.
WCAG 2.0 has 12 guidelines that are organised under 4 principles:
Content and user interface components must be presented so that users can perceive and should not be imperceptible to all of their senses. One of the most common colour vision deficiencies is difficulty distinguishing between red, yellow, and green shades. This is referred to as “red-green” colour vision deficiency. It’s a common problem that affects around 1 in 12 men and 1 in 200 women. This is why according to Success Criterion 1.4.1 “colour shouldn’t be the only means of conveying information, indicating an action, prompting a response, or distinguishing a visual element”.
An example of a colour contrast guideline from WCAG 2.1 is Success Criterion 1.4.3, which states that “the visual presentation of text and images of text has a contrast ratio of at least 4.5:1.”
Navigation and User interface components must be operable by the users and should not require interaction that users cannot perform. For example Success Criterion 2.1.1 states that “all functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes” to always offer users a fallback by using.
Information and the operation of the user interface must be understandable. This means that users must be able to understand the information and the operation of the user interface. The Level A Success Criterion 3.1.1 encourages companies to offer multi-language support for their products so that “The default human language of each Web page can be programmatically determined.”
Content must be robust enough to be interpreted reliably by various user agents such as assistive technologies. One such criterion (Success Criterion 4.1.3) refers to status messages and the manner in which they are presented to the user through assistive technologies.
Each Guideline has several success criteria associated with it, and these are grouped under three importance levels.
Text size and colour contrast guidelines example
Success criteria in level “A” are critical; failure to meet these criteria will limit access to your content for some users. An example of this would be Success Criterion 2.5.4 Motion Actuation which states that functionality that can be operated by motion can also be operated by user interface components.
Success criteria in level “AA” are highly important; some users might have severe difficulties accessing your content if these haven’t been met. An example of level AA criteria is Success Criterion 1.4.4 Resize text, which states that users should be able to resize the text without assistive technology up to 200 per cent without loss of content or functionality, except for captions and images of text.
Success criteria in level “AAA” are useful, but only target a small portion of users. Depending on your user base, you would select only the most relevant as these are typically treated as nice-to-haves. For example, Success Criterion 2.4.8 Location, which encourages websites to provide information about the location (the typical mechanism being breadcrumbs), is a very useful feature but only critical to a portion of the user base.
You can read more about the WCAG guidelines here.
To meet government accessibility requirements, digital services must:
More and more people will be gaining access to the internet in the following years and as your user base becomes more diverse, you’ll want to make your website more inclusive and accessible. Meeting accessibility goals feels like a big responsibility and, at times, overwhelming, given the number of guidelines and user needs you need to take into account. Luckily, the WCAG and trailblazing organisations like the a11y Initiative are fighting to make them as clear and easy to implement as possible.
We at Den Creative strive to make the experiences we create as inclusive as we can.
If you’d like to read more about our approach to accessibility and how that impacts the way we design websites, apps, wireframes, prototypes or anything else, please get in touch. We’d love to hear from you.
In this talk with Richard, we hear about how he got into development, what he likes most about it, a typical day at Den, and his advice for anyone starting out.
You’re currently a full-stack developer at Den; have you always been a developer or have you dabbled in other jobs too?
I’ve been behind bars (pubs and clubs rather than at Her Majesty’s pleasure) and worked in sales. In fact, massively failing at ad sales in a publishing company led me to follow a passion for computing – I picked up a book on HTML and then went back to the publishing company as their “web guy”. I’ve been a self-taught developer ever since.
Why did you become a developer and what do you like most about development?
I’ve always been drawn to computers and as a kid, I would copy BASIC code out of magazines into my Commodore 64. In early jobs, I would get involved in systems and create little access database applications for people to use. Becoming a developer was an obvious choice and back in 2000 it was a pretty simple thing to get going with, so I jumped in and got a job immediately and with zero experience – I hadn’t even finished the book I was learning HTML from! As a developer, you are presented with challenges on a daily basis and you’ll either know how to solve them or you have to go and figure it out; this leads to learning new stuff and a sense of achievement. It also leads to big highs and massive lows, but it’s worth it!
Do you have a role model in the development world, someone you look up to?
I don’t have any heroes as such but I do draw inspiration from a lot of people and they’re not all in the development world. I’ve met people who know nothing about code but pick it up in order to solve a problem – for example, a guy I met learned how to animate in Flash (this was a LONG time ago) and created a TV show with a mate of mine (The Amazing Adrenalini Brothers – check out “High Dive of Doom!”). To do that from knowing literally nothing about Flash was incredible and shows that with determination and passion you can achieve way more than you think – if they can, then so can you. It helps to remind you that no one is born knowing this stuff.
Take us through a typical day at Den…
A typical day at Den begins with a stand-up with other devs to talk through what they’re working on and any issues they think they might need help with. Work is generally organised into 2-week sprints and planning will have been done to establish what tickets will be worked on so everyone knows what the workload will be. After the stand-up, I’ll work on tickets throughout the day, perhaps with another meeting or two in order to refine an issue or talk through possible solutions. At the end of each day, there is usually another stand-up to go through what was achieved during the day and any issues that need some input.
What advice would you give to a developer starting off?
Although things have changed quite a bit from when I started building sites, the fundamentals haven’t. Start with HTML, add CSS and then learn some JavaScript. Next, learn how APIs work and you can start using a headless CMS like Sanity, Craft or WordPress. From there pick up a framework like Vue.js, React or Svelte and you’ll pretty much have the front end covered. But, the list of things you need to understand on this journey is huge and daunting, so the biggest piece of advice I would give is to not get overwhelmed by trying to learn everything all at once. Baby steps.
If you’re interested in hearing more about our development team, what they can do for you or what it is like working as one of them, you can get in touch here.
Design fidelity refers to the level of detail and functionality in a wireframe (not sure what a wireframe is? Read our quick description in our post here). There are three levels of fidelity: low-fidelity, medium-fidelity and high-fidelity, and some are better suited to some projects than others.
Let’s have a look at each in more detail.
Low-Fidelity
Designing at low-fidelity is straightforward and requires the least amount of time, not to mention everyone can easily get involved in this process. Pre-Covid all you would have needed is a fine liner or biro pen, some post-it notes, and loads of paper. However, creating low-fidelity wireframing to fit around remote working has shifted us from working with pen and paper to turning to more collaborative applications such as Miro and Invision freehand. A great starting point for creating low-fidelity wireframes is to focus on getting all of the requirements and user needs reflected in the wireframes first. Overall, low-fidelity is great for getting initial feedback quickly through user testing, for you to then go back and refine your thinking. This lays down the foundation for moving your wireframes into mid-high fidelity.
Medium-Fidelity
Mid-fidelity wireframes are perfect for when your ideas have been cut down and refined, and you want to start creating a more accurate representation of the product you are designing. These are digitally created and allow you to implement your ideas in a formatted version that allows you to accurately represent the product’s structure and content. Mid-fidelity wireframes should be kept clean and clear with little to no styling, and limited functionality. Overall, designing in mid-fidelity should help you to decide which elements work within your decided layout/structure, and pinpoint which elements could potentially cause the user frustration.
High-Fidelity
This level of fidelity is usually very close to the final product. High-fidelity wireframes are constructed based on design assets and components that have been tested, developed and refined multiple times. It is important that by this point you have collected enough usability data to help you determine what works and what needs to be adjusted or removed. A high-fidelity wireframe will also likely have a company’s brand applied i.e. colours, fonts etc.
In a nutshell, the lower the fidelity, the further away the wireframe is from the final product, and the higher the fidelity, the closer it is. It’s worth mentioning that design fidelity is not just limited to digital products, you may also hear people talking about the fidelity of a physical product, too.
There are many factors to consider when deciding which level of fidelity to design at, but one of the first considerations is the type of fidelity. Let’s look at some of the different types below.
Visual
Visual fidelity focuses on how closely your wireframe represents the final product. Applying some visual styling in early-to-mid fidelity wireframes allows you to test how your aesthetics impact the user experience, brand recognition, and usability. Based on user feedback this will most likely be reiterated a few times within the process.
Behavioural
Behavioural fidelity is how closely the prototype reflects the functionality necessary for the final product. Product behaviour is, more often than not, dependent on software. Using wireframes and user stories can help you input the desired functionality into prototypes when there is no software present. This is easily achieved without code, by using solutions such as Protopie, which allows you to test this type of fidelity. Overall, if you have the luxury of working alongside a software development team, it would be great to get them involved in the process of incorporating behavioural fidelity.
Content
Content fidelity deals with how accurately the content included in the prototype matches the final product. In an ideal scenario, you would have all of the content you need first to work with. However, more often than not, placeholders are used for content when designing wireframes for prototypes. It’s important to bear in mind that the user needs to know where a placeholder button will lead them during testing. So, it is best practice to use as much rough content and visual assets in the prototype as you would like to use in the final product. This ultimately helps with testing and creating the best solution.
Contextual
Contextual fidelity measures how closely a prototype reflects the actual product in use. For instance, if you are designing an IOS mobile app, you wouldn’t create the prototype for a desktop computer; you need to set the context. Applications such as Invision are useful for user testing on your desired device as it sets the scene for the product and gives the user a real sense of how the product can be physically used.
I think it’s an interesting point to make that each of the types of fidelity will likely be at different stages at any one time. For example, the behavioural fidelity will likely be quite low at the beginning while the visual may be in higher fidelity. As the process goes on, we gradually increase each of the types of fidelity.
Fidelity might sound like a minefield, but there are some general rules we designers follow. For example, when starting out on a project it is typically best to focus on low-to-mid fidelity first. Why? Because it allows us to iterate the designs, whilst carrying out task-based testing, reviewing data and making usability observations. Refining at low-mid fidelity saves us time and money in the long run, by ironing out the creases and preventing the product from launching with unnecessary/undesirable features and functionality. By limiting the level of detail and design aesthetics, we also help the client focus on what is essential in the wireframes and prototype, and not get distracted by colours, fonts, and images.
I hope this article has given you some insight into what we’re talking about when we talk about fidelity as well as the different levels and types we might be referring to. If you’d like to talk to us about how we design websites, apps, wireframes, prototypes or anything else, just get in touch. We’d love to hear from you.
In this chat with Emma, we learn about what her day-to-day job involves, how she manages her busy schedule, what she loves most about her role and a bit about what she was up to before joining the Den.
As a Creative Principal, what exactly does your job involve?
There are two parts to my job. As a Principal, I’m responsible for growing the business by building relationships with new clients, understanding their needs and how we can help. I then work with our design, strategy and development teams to put together an approach for the work that we could do together, and work with the client to get this right for them. The other part of my title, the creative part, nods to the other work I do, which is helping to deliver creative projects, including getting involved in brand strategy.
What does a typical day look like for you?
My days are very varied. I usually start by checking all the places where I might have messages waiting for me from clients or colleagues. After getting back to anything urgent, I’m into my day. It might be a mixture of internal management meetings, preparing proposals, pitching for work, catching up with clients and checking in with our teams on projects that I’m involved in to see how things are going. There are stand-out days when I might be helping to facilitate a workshop, or visiting a client on-site where they are (in non-Covid times), but the norm is a mixture of writing and thinking, talking and planning.
Your days sound so busy, do you have any ways of organising and prioritising everything you have to do?
I use one of our design tools (interactive whiteboard) for my epic to-do list management. I move virtual stickies between boxes (urgent and important, or non-urgent but important – you get the idea) and try to spend as much time as I can in the non-urgent but important box. This was a tip from a mentor and it’s really helped. It’s a constant battle to stay out of the urgent box in a fast-moving, high growth environment like Den, but it helps keep me focussed on what’s important.
What’s your favourite thing about your job?
When we manage to develop a trusted partnership with a client; when we all feel like we’re on the same page, working together to achieve the same thing. When we’ve earned a voice in company strategy meetings and when we nail the creative that we know is going to deliver on their strategy – that’s the best!
What were you doing before Den that equipped you for your current role?
I’ve had a varied career to date, spanning Firefighter to entrepreneur. But a few things spring to mind in terms of really preparing me for this role. Firstly, I studied History of Art at university. Having a deep understanding of the very first explorations of combining form (reality) with feeling (subjectivity) in art, as well as how we see and experience visual stimuli has really informed my understanding of, and love for, brand. Secondly, running my own removals and logistics business and building my own brand has given me a deep connection to the importance of customer-centricity, as well as the ability to empathise with our clients’ biggest problems, and help them to meet them head-on. I ended up pitching my business in Dragons Den, which means no pitch will ever be intimidating again. And finally, in agency life, there’s always a bit of firefighting to do!
In this article, Manny talks to us about how he entered the world of design in a turn of fate, the parts of design he finds most challenging, what he enjoys most, and the importance of a brand-led approach.
So why design?
Brace yourself for an age-old cliché; I have always been interested in design, I just didn’t know it, strangely. My childhood is littered with stories of how I would deconstruct household items and then unsuccessfully put them back together. During my formative years at school, I always found the creative subjects more enjoyable. I was lucky enough to have a couple of very talented and passionate teachers in Fine Art and Design, who really pushed me towards a career in the design industry.
I studied Industrial Design at University and then faced with the challenge, as many are, of trying to work out how I could enter the world of work, I landed my first role as an Account Executive at a creative agency. The Senior Designer at the time took a couple of weeks holiday, I picked up the work and loved every second of it. I’d found something I loved and I’ve never looked back since.
So why design? Probably because I have extremely patient parents and because Ben decided to take some annual leave. Shout out to Ben.
What are the toughest challenges of design?
That’s a good question. Every project is different and comes with its own challenges. For me, the toughest challenge is taking an abstract idea or insight and building on it to produce a visual identity that communicates it effectively. The concept stage of a project is filled with tangents of thought that you experiment with until you arrive at a foundational idea that you can build a brand around. At times it’s tough to trust the process and your idea. On the flip side, it’s also the most rewarding when you arrive at something that resonates with people.
What is your favourite part of the process?
I love the design development stage of the design process. When there is a consensus amongst all those involved and you can get into the nitty-gritty of a visual identity. It might sound geeky but nothing beats testing scales, typographical details, colour combinations, developing rules and guidance that connects all of the elements. It’s the part of the process that when done correctly can elevate your work.
How can a brand-led approach help a business?
We are living through an information and technology age where the speed of progress and choice is unprecedented, which in turn means consumer behaviour is shifting all the time. The amount of information available to us, and the speed at which it is delivered, is directly influencing the world of branding. There was a time when brands would live for a number of years, whereas now businesses are refreshing at a much quicker rate in order to remain relevant. A recent study by Hall & Partners and Wolff Ollins showed that “over half (57%) of consumers believe that brands need to do more to positively impact society.”
The tricks of the past are less effective; it’s not just about constructing a story around a business, businesses must now live their identity across more complex touchpoints and work harder to keep their audiences engaged, whilst also communicating their efforts towards a fairer and more equal world. Brand loyalty is becoming harder to come by as consumers become more conscious about where they are spending their hard-earned cash. This is where a brand-led approach comes in. A well-defined brand can help businesses navigate the complex and fast-changing societal, political and economic environment we find ourselves in and guide how they respond. How? By connecting with the business’ audiences, building trust and in turn generating brand loyalty.
What is the single most important piece of advice you would give to a prospective client?
Be original and stay true to your business’ values. Package what you stand for in a way that people can understand, then share, evaluate, refine and repeat. Sounds easy, doesn’t it?
You can see Manny’s most recent project here. If you’d like to find out more about our approach to branding and what we can do for you, or you’d like to join our team, get in touch!
The term ‘e-commerce’ has been around for quite a while now, in fact, since the 1970’s when Michael Aldrich created an online transaction service for TV sales. The e-commerce world has been booming for the last 20 years with the eBay’s and Amazon’s sparking a widespread trend away from traditional brick & mortar retail and has become an essential part of the worldwide retail framework. In part spurred on by the Covid-19 pandemic, businesses are recognising the need to invest in their online offerings and to scale existing sites to meet surging online demand. In this article, we outline what an e-commerce platform is, the types available and different things to consider when choosing which to go with.
The term e-commerce is thrown around a lot, but it’s simply the selling and buying of goods and services over the internet. By allowing businesses to sell, market and manage their products online, an e-commerce platform means businesses can reach more customers than if they were to have brick-and-mortar shops.
So now that we understand what an e-commerce platform is, what’s next? What options are there out there? Below you’ll find a whistle-stop tour of the different types of e-commerce platforms and a look at what you need to keep in mind when deciding which one you go with.
Subscription-based services
Designed with the sole intention of making e-commerce sites as easy as possible to build and maintain, SaaS e-commerce platforms are subscription-based providers of pre-built features at a low initial setup cost. They, therefore, provide an efficient and scalable solution for businesses to gain access to online sales as quickly as possible without huge costs. However, this does come with limitations as the building blocks cannot be fully customised to fit all specific requirements. These types of platforms use third-party apps to enable developers to build sites, but the actual ‘code’ to build these features is closed off except for small areas of customisation.
Positives:
– Quick and efficient to build and manage
– Low setup costs
Negatives:
– Narrow feature boundaries
– Increasing complexity and cost as the site scales
Examples of subscription-based e-commerce platforms:
– Shopify
– BigCommerce
– WooCommerce
Bespoke frameworks
Truly custom platforms provide the basic architecture by which developers can create detailed and complex e-commerce solutions, which means that all features and requirements must be built from the ground up. These platforms allow sites to be tailored to exact requirements and create a feature-rich and highly customisable solution. These bespoke solutions take longer to build and require greater expertise in implementing requirements than Saas platforms. This can increase initial build and setup costs and will also extend the time it takes to get your store live.
Positives:
– Fully customisable
– Scalable and futureproof
Negatives:
– Everything has to be built from the ground up
– High up-front costs
Examples of bespoke e-commerce platforms:
– Magento
– Laravel
At Den, we have built many e-commerce websites for our clients (Buster + Punch, Nourish, NICE Wine and JEALOUS) and we always follow a defined process when selecting an e-commerce platform. The first step in this process is always to sit down with our clients and understand their specific circumstances, this includes factors like budget, time and levels of unique customer journeys, as well as their future aspirations. Let’s take a deeper dive into each factor and how they affect which platform to go with.
Time to market
Some e-commerce platforms take longer to build than others so how much time you have will partly determine which type of platform you should go with. If you have less time, it’s likely you’ll want to go with a pure SaaS platform such as Shopify and BigCommerce as these enable fast and efficient development of the common features you would expect from a standard e-commerce site. Whereas, if time is on your side, a bespoke platform may be an option.
Initial setup cost
For many, the biggest benefit of SaaS platforms is their low initial setup costs. Given their reliance on ‘plugins’ or third-party applications that make up the bulk of expenses, purchasing the original platform falls in the low hundreds of pounds. This is important for those on a tight budget, but also for those who are conscious of the initial investment required. Although bespoke solutions are not expensive in their initial implementation cost, they do require more development so the cost of that needs to be taken into consideration.
Maintenance cost
With a subscription-based platform, there are various costs in running the site, including third-party applications and platform subscription costs. These costs can quickly escalate if your site requires lots of plugins, due to both the cost of the plugins and the time required to maintain them all. So, while a bespoke platform may cost more due to more development time, the expense may be balanced with the reduced cost in the long-term as they don’t require ongoing subscription costs nor as much ongoing maintenance once live.
Scalability
Pure SaaS platforms are designed with growth in mind. They are good solutions for sites that need to handle a fast increase in purchases and customer traffic. Platforms like Shopify enable businesses to have faith in their site’s ability to handle surges like for example on Black Friday. However, SaaS platforms do have a threshold for functionality, so while they’re great for a fast-scaling business, you could hit a point where you can’t add certain functionality that you realise you need (such as white-labelling your store for instance), meaning you might have to start again but on a bespoke platform. On the other hand, while a more bespoke system can certainly handle these waves in traffic, they are more suited to growing and scaling at a slower rate, as they are built with current traffic levels in mind. So, if you plan to see sustainable growth in traffic over let’s say 5 years, a bespoke solution could be a good option as you can then optimise for each traffic level.
Security
For all of our clients, the security of their site is of great importance. SaaS platforms successfully mitigate against security issues using out of the box solutions. With a bespoke build, you can have greater specific protection, but bespoke security systems do require more skilled and competent developers for setup and maintenance. The key thing with security is that no solution or platform should ever compromise security, so although comparisons can be drawn, an insecure solution shouldn’t be on the list to choose from.
Control and customisation
The biggest benefit of bespoke e-commerce platforms is how customisable they are. While SaaS platforms give a range of pre-built features for you to use and customise to some extent, bespoke solutions, like Laravel, can be designed completely to your business and customer needs. This level of customisation doesn’t just apply to the customer-facing side of the site, but also the administrative area, where you track orders, stock and fulfilment. With no limits to the levels of automation and digital innovation that can be built into bespoke solutions, you can control everything from fine-tuning customer journeys to optimised stock management.
As well as customisation, the scale and longevity of your site can be much better handled via a bespoke solution. Sites that are designed to grow and develop with your company are most often bespoke builds, as they allow for greater room for optimisation and enhancements over time. With SaaS platforms, it is more difficult to add features or optimise existing features.
Payments and checkout
Designing a site with a bespoke platform means you can fully customise the checkout and payment processes. With the basic Shopify system, a pure SaaS platform, the checkout page is a standard and generally uneditable, page that all Shopify-built sites use. This can be a drawback to those who want their brand and products to be front and centre in the buying process [editable with Shopify plus]; it also limits the available payment methods that a particular customer can use, as Shopify and others require you to use their in-house payment methods. However, the setup and use of this checkout procedure for both you and the customer is as easy and straightforward as they come. The more bespoke you go, the more customisations there are available to you, allowing you, for example, to integrate fraud services into your system. This also unveils other payment providers such as Stripe, as well as invoicing capabilities. But as with many of the benefits of bespoke builds, this takes time to design and build, increasing timelines and budget for initial setup.
We’ve outlined what we mean when we talk about an e-commerce platform, we’ve looked at the different types of platforms, from a pure Saas platform like Shopify all the way to a fully customisable framework like Laravel, and we’ve analysed the factors worth considering when deciding which to go with.
E-commerce can feel like a minefield, especially if you’re new to it, but it doesn’t have to. We take a lot of care and time during our discovery phase, working closely with our clients to understand the business needs and, most importantly, their users’ needs, before helping them to choose the right platform to deliver for them. If you have any questions for us or would like to have a chat about an e-commerce platform, don’t be a stranger! Get in touch with us here.
When a great product is delivered, it’s easy to forget that there were many teams of specialists working together behind the scenes to bring it all together; Kay is one of those people. Kay has hit the ground running and is working tirelessly to deliver the products we’re so proud of to our clients. We asked Kay some questions to find out more about her experience, what a normal day as Head of Delivery looks like and what she hopes to achieve in her new role.
Tell us a bit about you and your journey up to this point
I’ve had a really varied career so far but the majority of it has been in IT within Investment Banks and Financial Institutions. I’ve been fortunate enough to have worked in companies of all different sizes so I’m familiar with the pros and cons of both! I’ve also run my own business, which, to be completely honest, was not something I enjoyed, so I decided to go back to working for established companies where I could be part of a productive and entrepreneurial group of like-minded people.
Before starting at Den, I had actually worked alongside Elixirr (Den’s mother company) for almost three years. My experience with Elixirr made me feel Den would be somewhere I could be valued and make an important contribution so I’m really pleased to have joined and look forward to joining Den on their journey.
Can you tell us a bit about your role at Den?
My role is Head of Delivery; it is a broad role that looks at the processes and procedures that we use to deliver products and services to our clients. My role involves a lot of problem-solving and issue resolution so I spend a lot of time looking at what we do well, what can be improved and how. I’m a big advocate of collaborative working, which Den champions too, so I’m excited to continue encouraging collaboration wherever possible (it’s always possible!). I’m also a mental wellness and diversity champion and keen to get to work with the internal teams that are doing great things in this space.
What does a typical day look like for you?
At the moment my calendar looks like a sea of meetings! Every day is busy – but ‘good busy’! My days start at 6am when my dogs get up; I have 4 and so they need some TLC in the morning, or they will happily start a collective howl and wake the neighbours, ‘singing the songs of their people’! Once my chores are done I grab a milky coffee and some breakfast at 8am (ish) and I head straight into meetings. My meetings are varied; some are project-specific, others are with my team, making sure they’re all okay and answering any questions they have. I try to book an hour for lunch, but it rarely happens! It generally ends up as my emergency contingency time. But, I do try to take some time to grab a bit of food – I am lucky that my husband is at home too and is an amazing cook, so I am his chief taster!
The end of the day varies, sometimes my work day drifts into the evening, but I try to make sure that I have some ‘head space’ time, to commune with my husband and dogs and go to my happy place and sew. I developed a passion for sewing during lockdown and I am now an avid fan, so don’t call me when the Great British Sewing Bee is on as I will not answer the phone!
What are you most passionate about in technical delivery?
I’m passionate about being premier class in everything we do; I want every product we deliver to be nothing but the best. Technical delivery requires huge collaboration from a wide number of different teams and I love ensuring that the necessary collaboration happens. I think my greatest skill is bringing people together, problem-solving, keeping calm and always trying to have a fair and balanced view of issues and people, and a position in technical delivery requires all these traits.
What do you hope to achieve in your role here?
I hope to give recognition for excellent work, for collaborative and entrepreneurial spirit and also to ensure that we always have a heart-centred approach to business and that we always behave in a ‘human being first’ way. I would also like to mentor the more junior members of the team and help them build on their skills. I think the most important thing I think I could achieve from my role is to look back and see the progression from where we are now to where we will have got to and know that I have helped and been a part of that growth.
Oh, and next week World Peace and Hunger…
If you’d like to find out more about our capabilities and what we can do for you, or you’d like to join our team, get in touch!
A little more than a decade ago Ethan Marcotte coined the term ‘responsive web design’. Responsive web design came as a natural development to the emergence of mobile phones, tablets, and other handheld devices. Since then, the number of people browsing the web through their handheld devices has risen to equal, and eventually surpass desktop use. Today it is more likely for people to experience a website on a handheld device than a desktop, making it vital to the design and build of a website that it works across all screen sizes.
When we design a digital product like a website, we generally have two approaches to choose from: Responsive Design or Adaptive Design. At first, both might look the same as they help us achieve the same goal – to change the appearance of a website based on the browser width or height. However, if we look through the details, we will find the differences that make each approach unique.
What is Responsive Design?
Websites that follow a responsive design approach respond to the browser window’s width at any given point. The website adjusts to the browser window’s width by scaling, rearranging elements, and sometimes changing functionality to optimize the content for the specific screen size.
Why go Responsive?
Building a responsive website can make it more effective, scalable, and manageable to implement. This is mainly because we generally design two screens, one for mobile and one for desktop, and these can be built within one codebase. Of course, this comes with its challenges as it becomes more demanding to implement this solution for complex websites like large e-commerce websites. This is why we suggest the responsive design approach as the preferred method for smaller-scale projects with lighter content.
What is Adaptive Design?
Websites that follow an adaptive design approach, adapt to the width of the browser at specific breakpoints; a breakpoint is the point/width of the browser – at which a website page’s content adapts in a certain way to optimise the content by changing the layout and sometimes its functionality. In other words, when we open a website, the site chooses the best layout for that screen’s width.
Why go Adaptive?
This solution comes in handy on projects with a greater need to control how the content adapts. Adaptive design allows designers to control the user experience in more detail by tailoring the solution to the user’s needs on a specific device. This is why adaptive design might come as a better solution when creating some more complex websites that hold a lot of content, such as News and e-commerce sites, where the layout needs to be significantly altered on some screens.
How to figure out if a website uses adaptive or responsive design?
As a rule of thumb when we resize our browser window the responsive design scales smoothly and fluidly. While the adaptive design performs any changes only on the designated breakpoints. As always, the best way to tell the difference is to go and have a look and play around for yourself; the following websites are responsive: WIRED, The V&A, Swiss Air, BMW and New York City Ballet, and the following are adaptive: The Guardian, Amazon, Ikea, Adidas, Nike, AirFrance, and Apple.
Finally, to say one is better than the other would be wrong, as each solution achieves the same end goal in its own way. Choosing one over the other would be on a project-by-project basis and after careful analysis of research on how users interact with the product.
If you’d like to talk to us about how we design websites, apps, prototypes or anything else just get in touch.
In February of this year, Standard Life Aberdeen released the first glimpse of their rebrand (you can see it here). For those of you that don’t know the story, in an attempt to appeal to new audiences and position themselves as modern and dynamic, the Standard Life Aberdeen brand name has been shortened to Aberdeen – represented visually by a wordmark that’s lost its vowels.
The design industry and beyond swiftly set the beacons alight, with ridicule and tweets, mocking the name change, which brought on a sense of déjà vu for me.
Rebrands themselves are inherently daunting, especially for large consumer-facing businesses. Brand is the voice and face of any business; it’s what their audiences connect with, what they relate to, what keeps them loyal. While daunting, rebrands are an opportunity for businesses to present themselves more in line with how they see themselves; it’s a chance for a clean slate. Brands have a shelf life. In a world that is constantly evolving and evaluating itself, the most successful brands keep their ears close to the ground, listening to those shifts and aligning themselves to speak directly to their audiences.
Rebrands are often polarising. A well-loved consumer brand may decide that they want to shift their product line to those that are more likely to be adopted by a younger audience. They realise that their current identity and messaging speaks to an audience that doesn’t align with their future ambitions. They therefore decide that in order to give their new product line the best chance of succeeding, they need to present themselves as a modern and dynamic business. Pretty reasonable thought process.
However, by rebranding, they risk upsetting a large part of their current audience, who love and identify with them.
Rebrands can differ in scale and the industry has been trying to describe these different approaches to make the prospect more palatable for businesses – “we can refresh you”, “we can optimise your brand” and my favourite; “we can tweak it”. There is often a business case for small changes to a brand to help it succeed, and I have been a part of projects where a minor refresh was needed. However, more often than not those brands have been well managed through a process of constant evaluation and end-user insight.
“Abrdn” aren’t alone, the rebrands of Airbnb, London 2012 and BT were all met with ridicule. I read and heard numerous industry professionals airing their concerns, opinions and revelations about BT especially; “they paid that much for a circle?!”, “how did they go for that, I could have made that in my sleep”. The concerning thing here is that I would expect an industry professional to understand that a rebrand needs time to live, to sink in, to make its mark and most importantly to embed through a combination of consistency, recognition and messaging – driven by the organisation’s strategy, which can’t be communicated through a single press release. You would be hard-pressed to find anyone that didn’t think any of the aforementioned rebrands weren’t a success today.
The reason those rebrands have been a success is because they were strategically led. Airbnb recognised that there was an opportunity to be different to their competitors and appeal directly to the human and emotional need to belong. London 2012 recognised that they weren’t creating a brand for 2007, but for 2012; that represented the city as the melting pot it is and the games as something distinctively different to those that have come before. Finally, BT recognised that as the business grew they would need an architecture that was manageable and an identity that could reinvigorate itself in the eyes of the public, representing the future ambitions of the business across all of its media.
I’m sure that Abrdn’s rebrand has been strategically led and that, over time, we will all be able to appreciate its reasoning once it has had time to live, and we can see it in its full context.
For founders/business leaders that are thinking about a rebrand, my advice would be – work really hard to define what makes you different in a world where every organisation is fighting for attention. Weave a narrative and tell your story. Take a risk and be brave enough to live your point of difference and ignore the noise. If executed correctly you’ll quickly realise it wasn’t a risk at all.
And for all those industry professionals that are quick to ridicule, let it live.
Growing up I wasn’t sure what I wanted to do. I enjoyed problem-solving and making things from scratch but I couldn’t draw or paint and so I thought that meant I wasn’t creative. I didn’t let that stop me from exploring design as a career path.
I did a 2-year FDA in Design Practice at Camberwell College of Art and Design and topped it up with a 1 year BA in Design for Graphic Communication at the London College of Communication. My first job after graduating was at a tech company where I worked in the graphic design department. I enjoyed it, but knew I wanted to keep learning. My boss and I made a sweet deal that if I taught myself how to code I could join the web design team. Challenge accepted! 3 months later I had built my own website from scratch and became a member of the web design team. That’s how my coding journey began. Today, I work as a digital designer at Den, with a firm focus on user-centred design, including web and product design.
Although it’s not a must, there are clear advantages for digital designers who can code. I won’t pretend it’s easy. Learning HTML, CSS and JavaScript is a serious commitment that requires time and energy. Here are my top 6 benefits of being a designer who can code, with some real-life examples.
Working collaboratively with developers is a key skill. With some knowledge of coding, we can ensure that we have ticked all the boxes when designing for a particular technology. This eases the handover process and means we are speaking the same language as our development team (something that can sometimes feel a little tricky, I know). When it’s time to test, we are primed to identify bugs and unexpected behaviour with the products and can quickly work with developers to rectify them. Working as a team makes the process so much smoother.
Learning to code can ultimately make us better designers. Knowing the basics of development means we understand the limitations developers are working within, allowing us to design better solutions. Once built we have the capability to test our own designs, whether it be in a staging site or a live environment; we can inspect and amend code to experiment with the way elements look and react. Having the skills to test in an environment rather than needing a developer to take care of this part of the process really is a game changer for the way you’ll approach future designs.
In most projects designs will go back and forth between designers and developers, both sides adjusting and tweaking until the design becomes viable. All of this time comes at a cost. Knowing code means we can make better-informed decisions, ensuring that we create achievable designs from the get-go, and helping us better estimate the time it would take to develop our designs. In some cases, I have found that my knowledge of code has reduced a lot of the time typically spend handing over to a developer, as the foundations of the build are either completed, or much easier to explain to another team member. This makes the working relationship between designer and developer much more efficient, and allows us both to be part of the problem solving.
Since learning how to code, the prototypes I’ve been able to build have dramatically improved. One of the most useful skills we can learn as designers is the ability to create high-fidelity prototypes that we can show to both clients and developers. High-fidelity prototypes allow us to explain the look and feel of a product whilst also giving the clients the chance to see how their product will react, without the need for using imagination or loosely interpreting designs. While many of the best prototyping tools i.e. Framer, Protopie and Principle, can be used without knowing any coding at all, the method of thinking that is required to create complex interactions is very similar to the thinking required for coding. There have even been times where my ability to code removed the need for prototyping tools entirely because I used HTML and CSS in a code editor (I personally like CodePen) to create interactions. If it sounds like a nice smooth process, it’s because it is!
One of the big reasons I was employed here at Den was because of my ability to design and code. I guess you could say it’s my superpower. It is still quite rare to find someone that can do both, so if an employer is given the choice between two designers; one who can code and another who can’t, being the designer who has those extra skills will definitely give you the edge and increase your chances of landing your dream role.
I wanted to leave the best to last – and yes, this does show my geekier side. Coding is fun! Having the ability to take a static design and see it come to life is so satisfying. It gives you a sense of control and although time-consuming, you will see the results. It is that simple. In my case, I take every coding opportunity as a challenge. There is a process I follow to identify the problem, solve the problem through logic and turn that logic into code. This genuinely gives me a great sense of achievement.
A digital designer won’t need to use their coding skills every day, and we definitely don’t all need to be full-stack developers. But, having an understanding of the basics makes us more flexible when working within a multidisciplinary team. Just as an architect cannot design without knowing what materials he will be working with, how can we as designers do our best work without some knowledge of our medium?
If you’re a designer reading this and are interested in learning some code, there are some excellent free courses online, including Codeacademy, Gymnasium and Udemy. If you don’t mind paying to learn you could check out: General Assembly, Brain Station, Educative and SuperHi. If you’re not a designer but interested in how our multidisciplinary team can help you, we’d love to hear from you. You can get in touch with us here.
If you are unfamiliar with how digital designers work, wireframes might just look like a series of grey boxes with some random text dotted around. They can sometimes be as simple as a hand-drawn sketch on a piece of paper, or a drawing on a whiteboard, but you’re most likely to see them as low fidelity (simple) or high fidelity (more designed) digital designs.
They are in fact a super important ingredient when designing a successful user experience for a digital product and they act as a kind of skeleton structure for your site. We use wireframes to plan out what type of content will sit where on a page, based on how important each piece of information is. The content and functionality is mapped out, taking into account all the work we’ve done to define our users’ needs and the journeys we need to create for them. Think of letting a builder and an interior designer loose in your new house to knock down a few walls and start painting without first thinking about how the space needs to work for you with an architect and having plans drawn up. You wouldn’t expect the end result to be good, or to work for you and you’d probably just want to start again.
Because wireframes provide a map of how each page will be structured they allow us to look at the site structure with clients, and test journeys with users, changing things based on feedback, long before that becomes really costly. It’s much quicker and cheaper to change wireframes than it is to start messing with high fidelity designs or fully built products!
We often find that for people who don’t regularly work with wireframes it can be difficult to remember that they aren’t showing you how the final page will actually look. They’re showing you the layout, mapping out content and functionality, page by page. It can be difficult to get sign-off on the page structure without getting distracted and talking about the visual design. Testing with users can also be tricky for the same reasons so it only gets you so far. There will be things the visual design and the words will do that will help users find what they’re looking for that won’t be added until the next phase. It’s sometimes hard to find your way around a prototype that’s made up of only grey boxes.
We use wireframes early in projects to make sure we’ve planned out how we’ll meet all the users’ needs and the business’ needs that we identified in the discovery phase. If we can get things right at the wireframe stage it saves time and money later on in the project because we don’t have to change things when it’s harder to make changes. It’s also really helpful for the development team to have this to refer to as the project goes along – a map of the core structure and functionality of the site. Everyone needs a map to get where they’re going after all.
If you’d like to talk to us about how we design websites, apps, prototypes or anything else just get in touch.
If you’re sitting there thinking you didn’t realise a website could be environmentally unfriendly don’t worry, you’re not alone. Despite the internet being responsible for producing 3.7% of global greenhouse emissions each year (which currently stands at more than aviation!), there is very little awareness of the problem. As a designer, I design for the user and rarely think about the impact of my designs on the environment. However, I’ve recently become aware that there are things that designers, alongside developers, can do to minimise a website’s impact on the environment. To learn more, I spoke with some of our development team who already practice environmentally-friendly software development.
This is a good place to start because it’s only once people know how websites use energy they can begin to look at ways to reduce the amount used. Without getting too technical, the way a website works is this: a website sits on a server and every time someone wants to view a web page the browser needs to send a request to the server to ask it for information to display. In order to gather all this information, the server will compile and send back the information requested, routing back through switches, DNS servers, routers and caches. All of these machines require energy, in the form of electricity, to transfer data. The more complex a website the more requests it may need to make and, as we now know, more requests = more energy. If you consider how sophisticated many websites are nowadays: videos, high-resolution images, motion graphics, forms and more, you can begin to get an idea of how much energy websites consume.
There are many ways but the below are the top ones.
Images and videos are often very large files with more data than any other parts of a website page and, in order to send large quantities of data, servers use more energy. There are different ways of reducing the data weight of an image or video; the first is to use fewer images. This isn’t always possible, especially for websites whose popularity relies on their imagery. A client of ours, the world-renowned architecture and design magazine, Dezeen, is a good example of this. While Dezeen can’t reduce the number of images on their site without affecting the popularity of their site, they are working towards reducing their impact. How? This leads us on to the second way of minimising the data weight of images: optimising images and videos in such a way that the file size is reduced without impacting their quality or the user’s experience.
There are two types of fonts; fonts that come installed on computers; ‘system fonts’, and others that aren’t; ‘custom fonts’. While custom fonts allow for much more flexibility and artistic style, they can often be large files and require many requests to the server for the font file (as opposed to system fonts where all the data is already on people’s computers so no data request is needed). It might not always be an option to use system fonts as the choice is limited, but using custom fonts sparingly would be a good place to start.
How people navigate around your website is important. If the content structure is unclear people will click on numerous different pages before landing on what they wanted to find. By laying out your site’s content clearly, navigation will become easy and users will find the content they’re after more quickly, reducing the amount of energy used, both by your user’s device and the server.
Minimising the use of third party scripts can vastly reduce your website’s carbon emissions. Consider auditing your website to ensure all third party scripts are absolutely necessary. Having your website written in clean and streamlined code also decreases your website’s carbon emissions. Optimised code, written in a concise and standardised way (to remove duplication) requires fewer requests and less energy.
Much of the energy consumption a website creates is in data centres (physical sites where servers are held) through the transference of data. These days data centres have an energy-efficiency rating so you can choose to host your server in a highly energy-efficient one. Not only this, but you can also choose a data centre located as close to your target users as possible. As energy is used in transferring data, by reducing the distance data needs to travel between your servers and your users, you reduce energy consumption. So, if your users are located in the UK we would recommend hosting your server at a UK-based data centre rather than one in say, the U.S.
From a design perspective, many of the above changes also have huge benefits in terms of user experience and search engine optimisation.
All of the above changes decrease the time it takes for a website page to load. We’re all used to such frictionless experiences on the internet that our expectations of websites have skyrocketed; we want to buy a product with one click, we want websites to remember our information so we don’t have to fill it out twice, we don’t want to be overwhelmed by choices and, heaven forbid, we have to wait for a page to load! There are lots of different facts and statistics on how many users will drop off after just a 3-second wait time but what they all agree on is that the longer a page takes to load the more people leave. It’s also worth mentioning that Google has used page speed as a ranking factor since 2010 so a faster page speed will improve your SEO which means you’ll appear higher up on Google search results.
This might go without saying, but if your users enjoy their time on your website – if they’re able to find what they’re looking for easily or don’t have to wait for pages to load, they are much more likely to stay around and do what it is you want them to do. This could be anything from buying your product, signing up for your newsletter or sharing some of your content. In short, the changes we’ve spoken about in this article will all provide your user with a smooth and enjoyable experience and this will increase your conversion rates.
We hope you have found this article eye-opening about the impact websites can have on the environment. I’m going to finish by saying that while we should all continue striving to make our websites use as little energy as possible, it is inevitable they will always use some. A way of tackling the remaining amount of carbon emissions is by offsetting it through investing in an equivalent carbon saving elsewhere. There are many ways of doing this but at Den, we have a subscription with Ecologi, allowing us to offset our carbon emissions. So far we have offset 31.22 tonnes of carbon and have planted 709 real trees in Mozambique, Madagascar and the UK.
You might now be wondering how environmentally friendly your website is and exactly how much energy it uses. If you’d like to talk to our development team about your website and reducing carbon emissions, get in touch here.
You might have seen the terms UX design or UI design popping up all over the internet in the last few years and wondered what they both mean. ‘UX’ stands for user experience and ‘UI’ stands for user interface and both are part of an approach to design called ‘user-centred design’ (UCD).
UCD is growing beyond design studios and start-ups. Now, many of the world’s top universities and business schools are including UCD modules in their programmes.
What is User-Centred Design?
UCD is an empathetic approach to design that puts the user and their wants and needs at the heart of every decision when building a new product.
A user-centred approach incorporates validation from the user at every stage of the design process, as opposed to showing a user a finished product and hoping, with fingers tightly crossed, they like it.
UX, UI and UCD defined
Put simply, UCD improves the user’s experience of a product. If a product has been designed in a user-centric way the chances of a user liking it go up. This increases the likelihood of adoption, conversion, or whatever your business goal is. Where does UI design come into this? UI design is a part of the user experience and is concerned with how the product looks (vs. how the product works) i.e. what the user actually sees when they look at the product – think colours, fonts and shapes. In short, the better the UI design, the better the user’s experience is and the more successful your product is likely to be.
What is the user-centred process?
1.Discover
The first step in the process is establishing who your user is and answering the following key questions: Who will be using the product? Why will they be using it? What are they like as people? What are their daily habits? Do they have any fears or concerns that might be relevant to the product we’re creating? What problem/s are they trying to solve with the product? When and in which contexts will they be using it?
2. Define
The second stage requires defining all the user requirements that need to be met in order for the product to be successful. This is also the time to define the business requirements too, for example, opportunity for upsell, data capture or others. While the users’ requirements should be at the centre of this process it is important not to disregard the business’ goals.
3. Design
Now we begin designing! This stage requires problem-solving and designing different solutions to meet the users’ needs and requirements. This is best done in stages so as to make sure the product really is what the user wants without getting too far ahead and having to backtrack (backtracking can be costly!).
4. Evaluate & Iterate
Once we have a minimum viable product of a solution we think might work, we put it in front of a user; we watch them use it and we ask them what they like and don’t like. It’s also at this stage of the process that we often uncover unrecognised needs and desires, ones that even they didn’t realise they had. Through observing them and using tools like biometric testing we gain invaluable insights into subconscious habits and actions. Taking all this feedback with us we go away, make changes and then put the amended version back in front of them for a new round of feedback. This iteration process continues until we have a successful product, and beyond.
The user-centred process is a collaborative one between product creators and product users and in our experience it radically increases the chances of success of a new product.
How does it differ from other design approaches?
The opposite approach to user-centred design could be called ‘organisation-centred design’. This approach to design prioritises the business’ needs when creating a product and is the approach still taken by many companies. Businesses that take this approach first design a product and then find users that might like to use it. Unsurprisingly, approaching design this way often results in products that users don’t like or need, and of course, wasted time and money.
How a user-centred approach can benefit your company
A user-centred approach to design is a flexible way of working and that has a few advantages.
Faster to market
Minimising the specification means you get your product, albeit a simple version, in front of your user in a relatively short time frame and thus beating your competitors to market.
Keeps development costs down
With this approach, there is no wasted money on building features that the user doesn’t want or need. Getting the users’ validation at each stage means you only build what people will use. It also removes the margin for error so saves money that would otherwise have been spent on going backwards.
More desirable product
As a user-centred approach is guided by the user, the product is almost always exactly what they want. As we mentioned earlier, the user doesn’t always know what they want but through an iterative approach, we can uncover these needs and design a product that works for them.
Increased customer satisfaction
If a product satisfies all the users’ needs, you’ll have happy customers, which in turn means increased conversion rates, higher product adoption and realised business goals!
If you’re interested in our approach to design and would like to hear more, we’d love to speak with you, so get in touch.
It’s easy to showcase your design work as an agency, but much harder to show off your technical capabilities. Our development team are at the heart of the experiences we craft. Their thirst for knowledge, along with wanting every line of code to be better than the last, is key to our success. We asked Sophie some questions to find out more about her move in to web development.
So, why development, and what do you enjoy about it?
‘I was always interested in computers as a child but I never seriously considered coding as a viable career path. Growing up, it seemed inaccessible and out of reach. I subscribed to the misconception that you had to be the next Mark Zuckerberg or some kind of academic maths prodigy to be able to learn to code. I graduated with a history degree in 2018 and started to apply for roles in Social Policy, but I was struggling to maintain my enthusiasm. It felt like there was something missing.
A friend, who was also a fellow history graduate, had just completed a coding course and encouraged me to look into it. I found some free online Ruby and Javascript tutorials and started to enjoy it more than I thought I would. It sparked a curiosity and inquisitiveness from in me that I had previously lacked.
It was so gratifying to write some code, tell the computer to do something, and then watch it happen on the screen in front of you. I soon realised coding isn’t about how good you are at maths – it’s about how you think.
I joined a coding bootcamp and then started creating one page websites for my friends to showcase their graduate portfolios as practise, before applying for junior frontend developer roles.
Technology is constantly reshaping our way of life and how we do things. Working in an industry where you can watch ideas unfold from a whiteboard, grow into prototypes and eventually transform into a real life product/app is so exciting, and I wanted to be a part of it.’
What are the lows of development – what do you wish was easier?
‘Something that I wish was easier about development is how to explain something technical to a non-technical person. Often when you are working with PMs, clients or consultants, translating what you have been working on in a concise and clear way to someone not familiar with coding concepts can be challenging. The best way I’ve found is to use analogies and try to be as jargon-free as possible. To be able to do this proficiently is a skill in itself but its very valuable in bridging the communication gap within teams. Explaining to someone else also helps deepen my own understanding as breaking the process down into bite size, simple chunks reinforces every step of what is truly essential to the process.’
What are your favourite kinds of projects to be involved in and what is it you like about them? What interests you?
‘I love working in collaborative/agile teams. As a junior developer, it’s the best way to learn. There is so much to gain from working with other devs. Daily stand ups where you discuss what everyone is working on are crucial to our understanding of how the system works holistically and how each developer’s role helps to join the pieces that fit the puzzle together.
Currently, I am working on the front end of a digital banking project. We work in fast paced sprints where teams are broken down into smaller units, which often leads to pair programming. This has been invaluable for learning best coding practices, methodologies and reliable systems for making sure your code and design is maintainable and scalable, as well as sharing recommendations for the best third party plugins, which are all dev approved. For example, in this project, I learnt defensive programming techniques which are designed to help your application behave in a consistent way even in unpredictable environments. I also gained experience in Tailwind, a utility-first CSS framework, Blade, a Laravel templating engine, as well as Cypress, an E2E testing framework which involves testing an application’s workflow from beginning to end.
Pair programming has also been a good excuse, especially now that we are all working from home, to catch up with the other devs – lots of screen shares and daily zoom check-ins help keep the office spirit alive.
Other kinds of projects I like working on are anything with a fun, quirky, interactive design. I would like to look into creative coding one day which has become a very interesting intersection between coding, design, art and technology. I came across creative coders on instagram like @tim_rodenbroeker, @zach.lieberman and @kiyoshinakauchi who use generative design software like p5 and Open Frameworks to explore the creative/artistic possibilities of programming, giving new meaning and interpretations to loops, algorithms and patterns.’
If you’d like to find out more about our development capabilities, or you’d like to join our team, Get in Touch!
If you own a successful small or medium sized retail business but you’ve never sold your products online, you might be wondering whether you need to. Or perhaps you’ve just bought a business that has a healthy balance sheet and proven track record but no online presence and you want to supercharge growth. Either way, it’s time to go digital. Here are our top five reasons to embrace e-commerce.
Some industries have been decimated by the rise of ‘digital first’ giants. It’s hard to predict which sectors could be hit next. From Amazon closing down department stores, to music streaming sounding the death knell for your local music store, if you aren’t yet selling online, you are more vulnerable than most.
Statista claims that in 2019 there were 1.92 billion digital buyers worldwide with e-commerce sales accounting for 14.1% of all retail purchases. If 14% doesn’t sound like enough of a reason to go digital then think again. This share is rising year on year and e-commerce is the biggest driver for growth in the retail sector overall, both in North America and Europe.
Every business wants to make more money. Numbers vary from business to business but BigCommerce says that physical stores that open an online store are making 28% more in revenue via their online channel within just six months. You are tapping into an audience who may only shop online (or even only on their phone) for convenience. A whole new audience you couldn’t get into your store. A larger customer base means more revenue.
The modern consumer has honed in on their affinity for certain brands. They don’t just choose the company that is geographically closest to them anymore, they choose the brand which is most aligned with their values. An online store gives you the opportunity to communicate to a wide audience who you are as a company, what your values are and why you do what you do.
Modern e-commerce platforms are sophisticated. They can sync with inventory management and fulfillment systems. You can build your audience with search engine optimisation, social media campaigns and paid online advertising. You can even send out emails to customers who filled up their cart and then got distracted, to try and tempt them back to complete their purchase. Opening your online store can form part of a wider project to digitise analogue, outdated processes across your business. Saving money and making more money at the same time. What’s not to like.
This is where we come in. Den can help you get your brand ready for digital, design and build your online store, or help you with digital transformation across your business.
Creative thinking can have a huge impact on business and in a climate where businesses must innovate or die, this is more true than ever. Aspiring creatives leave university or college with a basic set of tools, but what they do with them and the impact they can have are really wide open. Den went to the University of the Arts London (UAL) Creative Futures week to inspire the next generation to think about design thinking and the impact it can have on business.
Our growing team of designers and developers have between them an amazing breadth of skills and experience. One thing they have in common is that they never imagined the impact they could have on the business world, by applying the kind of thinking they have learnt in their education and work lives to date, to business problems.
Den regularly undertake transformational brand and web projects for our clients but since teaming up with Elixirr, we also take part in the design thinking process that Elixirr, the challenger consultancy, have made their own.
We headed over to UAL at Elephant & Castle to tell the story of this kind of work.
At the start we help our clients to define their challenge (a problem they want to solve). Then we aim to expand their thinking by showing them cross-industry content about innovation and how consumer’s expectations are being raised by other industries to the point where they are no longer happy for signing up to a bank account (for example) to be a lengthy, paper based, in-person process.
With minds expanded, our team take the clients through a process of refining a solution. The idea is not just to improve their current offering but to move into a space they might not have imagined before they defined the problem, but to really aim high for their consumers. The outcome of that workshop process is often some very low fidelity wireframes of a potential application, dashboard or similar that is going to do more than just solve their problem.
At this point the design input really ramps up. We go through a process of rapid prototyping and user testing until the design is ready for the team to build the MVP (minimum viable product). Sometimes we can take advantage of time zone differences and clients will go for dinner leaving hand drawn app screens on the wall and wake up in the morning to a working clickable prototype. We move from low fidelity prototypes to high fidelity designs making sure that the UX is slick and the look and feel is inline with the brand and enhances the user experience.
We then talked through translating the designs into the final product through the build phase of a project. As our developers are part of the Den team, they work closely with our designers and the consultants to make sure development is not only fast but accurate. We can sometimes go from defining a problem to launching a new application live in the space of four months.
Vanessa inspired me to suggest Den take part in Creative Futures because she said to me that she loved the work she was doing. At the time she was working to solve extremely complex user experience issues on a trading platform. She added that never in a million years would she have imagined that this is what she would be doing a few years on from leaving her design training at UAL. It feels really good to be making such an impact with the tools she left university with and adds to every day.
We had a great audience who asked lots of questions about how their skillset might fit in to the journey we had discussed, as well as seeking more general career advice. It felt important for Den to be part of this Creative Futures event. If we don’t reach out and tell our story then we only meet the creatives who have already made the leap to see their value in the business world, and we aren’t necessarily meeting the very best thinkers from the creative talent pool. We always look forward to welcoming new creative and technical talent to our team!
I am not a savvy shopper, definitely not a committed bargain hunter, but I am obsessed with brand identity, authenticity and the emotional connection between brands and their consumers.
Everything about walking into a shop in sales season puts me on edge – the jumbled rails of mismatched items dangling by a shoulder from the hanger, the elbows, the frustration and palpable anxiety bubbling just below the surface in my fellow shoppers. There’s also the stories of people getting stretchered away after midnight stampedes and security guards getting battered out of the way, around the world. Online sales are a little easier for me – less elbows, less bubbling rage, more filters. But, you can still trawl pages and pages of ‘load more’, find exactly what you want and then discover it’s only available in a size 6 (not my size by the way). I’ve often used up the last of my short attention span to get to this point and the frustration is too great, I bounce.
So, it’s no surprise that on Black Friday, rather than queuing from 3am to get my hands on an Xbox, I’m analysing how brands have approached the dangling carrot of a revenue feast and whether they’ve managed to hold on to the meaning of their brand, the message they want their consumers to believe that they believe in, or if they’ve left it trampled on the floor below the shelves piled high with goods, bought in to flog to the frenzied crowds. Have they harmed or enhanced the loyalty consumers feel towards their brands?
Some brands have nailed Black Friday. They’ve cut through the noise and most importantly, they haven’t lost themselves along the way:
Dewerstone are an outdoor lifestyle store and brand. The first line of their ‘About Us’ page on their website says ‘We’re people that love the outdoors.’ And what did they post on Black Friday? ‘We’re shutting the shop, office & warehouse doors on Black Friday, we’re just not into it. We’re going adventuring instead.’ They don’t just talk the talk, they walk the walk. They are prioritising their team and the outdoors for a day. As a brand who want to be part of the outdoor community, who typically are interested in quality, and the environment, the risk to their revenue in not taking part in Black Friday, was outweighed by the risk to their brand if they did. In case it isn’t clear enough whether they care more about their customers’ loyalty or their bottom line on Black Friday, they even take a moment to thank their followers for being customers every other day of the year.
Patagonia, another outdoor brand, state very clearly on their website that their mission is that they are in business to save ‘our home planet’. In 2016 they launched their Black Friday campaign ‘100% Today, 1% Every Day’. They pledged to donate 100% of their Black Friday sales to grassroots nonprofits working on the frontlines to protect our air, water and soil for future generations. And guess what the final sales tally was for Patagonia that day? $10 million. Good call.
Pieminister turned Black Friday in to Black Pie Day in 2018. Since their inception, Pieminister have donated pies to good causes, from homelessness hostels to community fairs to fundraising banquets. They call these donations Little Acts of Pie-ness and their website states that they’ve put over 200,000 pies to good use in this way already. Every Black Friday they give away pies in their shops and pop up shops around the country in exchange for donations to Shelter, raising thousands of pounds. The purported values of the brand, what they care about, what they think matters is clear to any consumer. It isn’t a gimmick, it’s who they are. So, they lose a days sales, but they gain a loyal band of pie eaters in the process.
They have always maintained a policy of no deals, no discounts, for their game. Before Black Friday 2013 the game had always been $25,and the makers felt that doing any kind of deal or discount would undermine the simplicity and honesty of the game. This is a really important brand value and really difficult to uphold in the maelstrom of deals that is Black Friday. In 2013 they settled on their angle, they raised the price of the game by $5 and saw a huge sales spike as a result. Their campaign parodied the slightly stomach turning marketing concept of establishing scarcity, leading people to purchase when they wouldn’t (or shouldn’t) normally, due to a manufactured sense of urgency. They crossed out the $25 dollar price tag and listed the new $30 dollar tag, with phrases like ‘Today only!’ And ‘Once-in-a-lifetime-sale!’.
This year they’ve gone fully dystopian pitting their human staff against a bot to see who can come up with the most popular pack of new cards. Again, no discounting and a perfect illustration of their playful brand identity, hopefully creating new encounters with their brand for new customers.
A sustainable fashion brand, founded by a group of surfers committed to protecting the oceans have turned Black Friday in to Green Week: ‘Black week turns green – one order = one tree’. They offer to plant a tree for every order placed in Green Week. They haven’t ignored the discounting element of Black Friday, offering ‘special discounts for a better future’, but they’ve added meaning. To date (since Sunday 24th November – in 6 days) they have planted 4673 trees. That gives me, as a consumer, 4673 reasons to believe them when they say they care about the oceans, and that they believe that without green, there is no blue. They are acting in support of their words and getting my buy in as result.
Defining what your brand means, and what you believe in is the first step in any branding journey. Long before you have a logo and a colour palette, you define your identity. Then, you need to build and protect consumer belief in that message. Once lost, never regained. The excesses of Black Friday leave me feeling a little queasy and, particularly in a time of environmental disaster, a burgeoning debt crisis in the UK, and increases in homelessness and poverty, the idea of manufacturing a sense of urgency to encourage people to spend when they might not if they had longer to think about it seems wrong. It leaves me cold.
Offer to plant a tree with every order? I’m pulling out my wallet. Shut up shop to go adventuring on Dartmoor? I’ll be queuing up the next day for you to open the doors. No brands can afford to ignore huge retail events like Black Friday but what you do about it can help you define who you are as a brand, or it can destroy the identity you’ve worked so hard to communicate.
We as humans have started using natural language processing commonly in our everyday lives. It’s a digital trend which has emerged alongside the prevalence of AI. It is predicted to be a large part of businesses innovation going forward and we, as consumers will be interacting with and using it on a daily basis in addition to implementing it our products.
Natural language processing is essentially voice or text recognition software also known as NLP. It’s the process of taking a human user output processing it with artificial intelligence, transforming it into something that a computer can process and determine an appropriate action to take. For example, when you talk to you mobile phone and ask siri or the google assistant to write an email for you, this is considered NLP.
For NLP to understand human language the program needs to be trained for it. This usually means processing thousands of items of text or speech in order to get a base understanding of the human language. This includes words, grammar and names in addition to the natural flow of the language.
NLP services are usually trained with text books for example since these have correct spelling and grammar throughout. It’s important to remember that the AI will be trained on a specific language such as England or Spanish so if it’s to be used in another language / culture it we need to be trained specifically for it. It can be trained on anything, you can make up your own language and then train the NLP model to respond in the way you want but it might not be a very popular service.
For example “I would like to buy size twelve shoes”.
The intent might be “purchase item” and the entities would be “size 12” and “shoes”.
If this sentence was used with a bot on ASOS for example it may then direct the user to a page of shoes size 12 that they can purchase.
Often NLP models will be designed to work for a specific purpose so they will be expecting a type of intent, this makes it much easier to train and use. For example an ASOS bot will be expecting questions about its products, company or orders and not questions about if the earth is flat.
The NLP software is likely to be running on a server and accepting requests from lots of sources, this means any users with a device connected to the internet should be able to send a request to the software.
Natural language programs that can process human speech usually work by being trained on transforming the voice speech into text. Once they can transform the speech into text they work the same was as other NLP services by processing the text as intent / entities.
A simple use is to direct a user around a website, when they first navigate to a site they might not know where to find what their after so if there is a chatbot on the website they should be able to ask “Where can I find the benefits application form print out” and the bot can reply with a link to the correct page or download.
A very practical use is being able to talk to a GPS in your car, you can ask for directions to the location of the distance left on your journey all via voice speech. This means users don’t have to take their hands off the wheel or their eyes off the road making it much safer.
Another use could be analysing all the posts in a forum, this could generate lots of useful information such as the general sentiment of what users are discussing (games / sports / clothing) their attitude (happy / sad / angry), this feedback could be used to make appropriate improvements. This could also be used to discover anyone using the forums for nefarious uses such as scamming or planning terrorism attacks (yes really!).
There are a couple big players in terms of NLP, most of them are paid services, lets cover them first. This is not a comprehensive list of all the NLP systems available just a few examples.
With the emergence of NLP there has been an explosion in the amount of companies trying to offer their software solution. Several of the big players like Microsoft and Amazon have very capable systems. I would recommend if your looking to experiment and get started in NLP to use Rasa since its open source and has a lot of tutorials and guides on getting started in the world of NLP.
They are usually trained for specific uses so will not be able to handle anything they are not already expecting. For example, if you try asking the ASOS chatbot bot for directions to Leicester, you’re probably not going to get a satisfactory answer.
They also need to be trained for specific languages so if they need to be accessed in an alternate language they will have to be entirely retrained for it.
One issue I encountered when developing a chatbot for a website designed for British Muslims looking to regain their faith was the issue of dual language. I found that often British Muslims will use a mix of English and Islamic words and this caused confusion in the processing. The solution to this was to use a more generic AI to process the input which didn’t rely on knowledge of a specific language but instead used traditional AI techniques of comparing raw characters and words with a very large training data set in order to best match up the user input to a defined intent.
NLP can take a large amount of processing power, training the model to process the inputs can take some time depending on the complexity and the amount of training data. Requesting the model to do the processing on the input can also take a lot of processing power but nowhere near as much as the initial model generation. While this in preventive it is something to consider when developing an NLP system.
When it does go it wrong it can fail spectacularly, for example “how I can I deal with bullies” could be interpreted as the user wants to sell their bike to an bullie rather than how the user should act when confronted by a bully.
A key aspect of the NLP models and technology is that its constantly being improved. As people use and play with the NLP services available, they are being tracked and when a model predicts something correctly or incorrectly, this is being logged down and can be included as training data in the next iteration. As time goes on the NLP services as well as the models we are training are going to get better and better at predicting our language.
As the software and methods for NLP improve over time we will be able to use it in more sensitive areas for example someone’s entire medical history could be processed by NLP and the important and relevant points to the task at hand can all be surmised to a doctor.
We don’t know all the areas we can implement NLP yet but as the world’s data is consistently increasing in quantity (expected to double every two years), we will need to find methods of processing this data in an efficient and error prone manner, NLP could be the solution.
By 2020, it is predicted that 85% of consumer interactions will be handled without a human agent (Chatbots Life, 2019).
67% of US millennials said they are likely to purchase products and services from brands using a chatbot (Chatbots Magazine, 2018).
With four key speakers from various industries, including JustEat, there was plenty to take away from last week’s Tech Talent Forum hosted by Makers Academy.
Just off Commercial Street near trendy Brick Lane, Makers nurtures technical talent and partners with global clients to help with the hiring process and placement.
Focussing on creating a culture of learning, the evening was sure to be interesting for anyone from a technical background, but also as a manager, improving culture is an ongoing item raised at monthly meetings.
In all honesty, I wasn’t sure what to expect from the event. A learning culture can be tricky to get right when faced with ongoing client requirements and project deadlines, however I’m glad to say I’ve taken away some key thoughts that we will aim to implement across our business. It can’t hurt to try, right?
A-ctivity – Inherited attributes that are difficult to teach
S-kill – Needed but can be taught
K-nowledge – Required but will grow
In short, creating a good culture starts with a good hire. We know this already, but what is that in reality?
Looking for a team member that has an abundance of skills and knowledge, is not necessarily going to add to the culture. The third piece of the puzzle is Activity and inherited skills. Is this person going to be difficult to manage or do they already have the attributes to integrate smoothly with the team?
A bold statement which will ring a bell with many hiring managers. How we define a problem is down to the individual company but in a nutshell, Jeremy Burns (News UK) described this as a team of perfectly lined bowling pins being knocked over by the ball. Disruption to the team can have positive and negative effects, usually the latter.
Instinctively we don’t like change. Occasionally we need to throw a curveball at the team but in a positive way. A disruptive addition to the team can have serious consequences. Follow your gut instinct and watch out for a lot of “I, I, I” and also a lot of “we, we, we” answers when interviewing. A balance in the middle is usually a good start.
Kate Richardson from Just Eat spoke about how her team have reviewed job titles and aimed to demystify senior positions by introducing tiered mentoring within her team. Allocated time and tasks are distributed and solutions are thought through and tested.
In theory this sounds great, but in agency land, we tend to require the team to utilise 90% of their time on billable work. The other 10% should be spent on personal development but striking a balance between client v internal tasks makes this sometimes impossible.
Institutions are failing our teams. This was the view of Fred Scholldorf, (Global Relay) who stated that it’s a digital world and still our education institutions are not prioritising this in the way they teach. In the technical world, teaching students how they learn opposed to a specific subject, will nurture a more useful skill set for budding developers.
Strange huh? Well, Makers believe that every error provides a learning experience and now it makes sense. “Why did this happen and how can we avoid this in the future?” A normal reflection we have when something goes wrong. Pointless if we don’t learn from it.
Build, learn, improve. Don’t engage with an error at a concrete level, the black and white, right and wrong way. Pass on your knowledge of how to learn a process to fix the error and your team will enhance their skill set along the way. This applies to all roles within your company.
Give a developer a solution and he’ll apply it, teach a developer the process of finding a solution and he’ll always (eventually) complete the puzzle…
In summary, there were a lot of points raised that I already see in practice here at Den, but with an ever-growing pool of skilled resources and varying skill sets, consistent communication and knowledge sharing is first on the list to get right.
