Why Visual Languages Are Vital For Your Site
Within digital marketing, there are a variety of crucial factors that every webmaster or business owner has to utilise to provide optimal success. By utilising the latest technologies and keeping up with ongoing trends, providing your business with responsive web design is simple, but what if you don’t know where to start? To properly understand the impact of a coherent visual language like Google’s Material Design for our online products, we need to look at the internet’s history to see how web user interfaces have evolved. We can then see how this has impacted the way we do business online today or how the users react. At current developing rate, the internet could look extremely different in the coming years, so how do you future-proof your business? We’re exploring precisely that, below.
The Past, Present And The Future Of Web User Interfaces
We won’t go as far as the nineties to analyse how web user interface design evolved, as those were times when people didn’t really know what the World Wide Web was developing into. We can just agree the nineties were a decade of exploring what the internet could become, a time when the internet was free of visual (and sometimes legal) constraints and when everyone could express themselves openly, all because no one really knew just what impact it would have in a surprisingly short period of time.
To be accurate, we should start our analysis sometime near the year 2000, when there were clear signs that the web was starting to become more organised. New technologies were developed and web standards began to emerge, being quickly adopted by the bigger companies. This helped them to optimise their workflows and allowed for new technology to be developed within these organisations.
The year 2000 is also the climax for the infamous dot-com bubble. in which many companies failed to show that they really understood the future of the internet. However, others that were better at adopting new technology/standards managed to recover and even surpass their peaks.
Companies like eBay, Amazon and Cisco are currently top players in the IT industry because they demonstrated the capacity to quickly adapt not only to new trends and technologies but also adjust to the unexpected. We could say that the ability to use a common visual and technological language is the key element that managed to propel these companies into the position they stand today.
We can draw a few conclusions if we were to analyse how user interfaces from top internet websites looked in the year 2000. They are as follows:
- There were clear signs of the web starting to get more standardised.
- User interfaces weren’t the main concern when developing a website. Web architects mainly focused on the functionality of the website/product and a lot less on what we would call today “user experience”.
- Technology at the time clearly limited the possible usage of better user interfaces, but companies did not invest too many resources into this area, making the user interfaces always a few steps behind the available technology.
Through The Years
If we directly time-jump to the present day and compare how companies have evolved, we would begin to understand how we got here and why. After the dot-com bubble, internet giants began to understand that basing their entire infrastructure on just functionality was the wrong approach.
Between the actual product/service and the functionality of the website, there was a third variable that, until then, didn’t have a place in the workflow: the user/the customer. Even though the websites were intended to be utilised by a person in the end, entire websites/products were built around a functionality, a technology or a service.
When companies started to analyse user data (the moment the technology became mature enough) they realised that building a product that is not user-focused and forcing that user to adapt to the actual product was leading to a lot of wasted opportunities.
So, how can a product be designed with the user as the main focus? For the first time in the history of the internet, companies understood that they needed to make another radical shift. The companies that quickly adapted to this are the ones that are still with us in the present.
Following the dot-com bubble, and because the technology was already a few steps ahead, there was just a question of encouraging user interface innovation. This is how websites started to see the integration of animated content, higher resolution images, better typography, better layouts etc.
These years can be described as a period of setting the base for what we currently refer to as UX/UI design. This was largely down to the fact UI design was beginning to catch up with technology, creating a need to make access to those technologies easier so that people with less technical skills could use them.
This is how we saw the birth of open source content management systems like WordPress, as well as innovative companies like YouTube, Facebook, and Myspace etc.
We then saw those trends gaining momentum and witnessed the rise of skeuomorphism, using higher quality images for websites at an affordable price through stock photography websites and the launch of smartphones.
There was a shift from skeuomorphism towards flat design mainly because smartphones needed more clarity and user interfaces capable of satisfying different needs yet. The only major drawback was the constraints on space. Technology-wise we saw the rise of responsive design which addressed any new needs for users. There were now multiple devices with different resolutions and hardware specs accessing the same information.
2014 – Present day
This is the period in which the foundation of the Internet of Things was laid. The Internet is simply not the same as it was 20 years ago since it’s now a network of connected devices (from sensors to mobile phones, from self-driving vehicles to virtual terminals and AI chatbots).
If we take a look at this period, we can anticipate factors that could arise in the future. The user is still at the core when it comes to the internet, however, the number of connected devices has significantly grown and it will continue to grow in the future.
People are using more devices and modern user interfaces need to adapt to those devices. Responsive design has clearly evolved into the adaptive design, which addresses the variety of available devices.
By analysing the past two years in detail, we can clearly see the following trends:
- The number of devices connected to the internet has grown and will continue to grow (according to some studies it will more than double by 2020)
- Visual design languages are being developed together with the most up to date technologies. Design and technology are now developing at a similar rate and towards the same goals for the first time in the history of the user
- Even though standards create constraints, they also encourage innovation by creating better and more advanced interfaces/technologies.
We can’t know what the future will be, but we can rationally anticipate what shape it could take based on previous experience and current trends. The user will still be at the centre of the product design, but the internet is a concept that is going to oversee continuous changes.
New products are now created by the introduction of new innovative hardware on the market. Every new technology can introduce a major shift in what we call the Internet of things. Everything is happening at a faster rate and if you have an online business you need to be prepared for the future, otherwise, you risk becoming irrelevant a lot sooner than expected.
Since the way products/websites/apps can be designed and launched a lot faster than a few years ago, online business owners need to quickly learn that they can only survive through continuous improvement. They also need to be aware of disruptive technology that could render them irrelevant if they do not offer the right kind of product/service.
A lot of online businesses haven’t adapted to current technologies/user interfaces. This is mainly because they find themselves in niche areas where competition might not be very high. The main risk comes when your competition employs newer and better technology and rises within that niche.
As an online business owner/stakeholder, you need to be prepared for the future. This can be achieved by implementing a coherent visual language across your business, especially for your online presence. One of those languages is Google’s Material Design.
What Is Material Design And What Can We Learn From It?
Material Design is a visual language developed by Google in 2014. Despite its age, the concept is not outdated and has been continuously updated and developed by Google ever since it launched.
It started out as a simple set of rules and guidelines which developed into a fully grown visual language that includes a variety of core information. This includes everything from the properties of the “material” to motion, layout, components and patterns. You can think of Material Design as a visual framework for your online products that allows for a unified experience across different platforms and devices.
Technically speaking, Material Design is based on flat design principles (stripping every element to the basics for clarity), but it implements elements of skeuomorphism as well (drop shadows for example). It’s not the only mature design language currently available since there’s also Microsoft’s Metro, Apple’s iOS Human Interface Guidelines and IBM’s Living Language as some of the other well-known design languages in use.
There is one main reason why we chose to focus our attention on Material Design for this analysis: it’s the most balanced design language to date. It doesn’t go as far as flat design to remove every trace of skeuomorphism; instead, it keeps some skeuomorphic elements that are considered to improve the user experience. User experience is becoming hugely important across the internet, with Google Rankbrain and other technologies looking to continually improve as technology evolves. A secondary reason for this analysis is the fact Material Design does not have a set of rules which are set in stone.
It’s continuously developing and changing together with technology. Rather than changing in more abrupt steps like Apple’s design language, it adapts to what the Internet of Things demands.
Rather than examining the basic principles of each design language and comparing those (which will always be subjective due to the nature of design), when choosing a design language for our online product, we should take into account how each design language would be able to adapt to change.
Plan for the future and rationalise your decision, rather than siding with one design language and blindly implementing a set of rules simply because they are currently trending. Your needs might be totally different depending on the specifics of your business, your products or your target market.
So, What Are Some Material Design Key Principles That We Can Predict For The Future Of Web User Interfaces?
We’re not going to do a full study on Material Design and analyse every principle it employs. Instead, we’re going to focus on the principles that bring something new to the table and have an impact on the future.
When choosing those elements, we took into account the current development of new technology like wearable devices, gesture user interfaces (we’re sure everyone has seen Steven Spielberg’s Minority Report), augmented reality, voice user interfaces, sensor networks, virtual reality devices etc.
The introduction of new technology is bound to change what the Internet of Things is and how businesses will interact with users five years from now.
With this being said, let’s take a look at some Material Design principles that will most certainly be a part of the future user interface:
- Material Is The Metaphor: A key principle of Material Design which states that a material is grounded in reality (3D world), thus it’s influenced by light, interaction and movement of other elements. The material is impenetrable and occupies unique coordinates in space so two entities cannot overlap.
- Motion Provides Meaning:Another key element to take into account, as motion should provide meaning and help the user navigate. Animation shouldn’t be used without a proper meaning behind it.
- Choreography:This element is strongly connected to the previous one. Transitions/animations are sharing elements in order to guide the user. Animations should show continuity and should not confuse the user.
- Light and shadow: They provide context and guide the users helping them understand the hierarchy of elements in a design.
- Layout:Imagine a sheet of paper in reality that is translated onto the screen. The material keeps most of its physical properties but also takes advantage of new properties that are only possible on screen.
- Elevation and shadows – the Z-axis: Shadows have been used for a long time in web user interfaces, but this is the first time when the shadows are perfectly rationalised, providing both context and hierarchy for each element.
- Colour:Colour choices should be bold, vibrant and unexpected. This should be achieved by using adequate colour schemes and element opacity.
- Images:Images should represent more than decoration. They should provide even more meaning to the interface. Imagery needs to be intentional.
- Sound: Same as for images, the sound should provide more meaning and must be intentional.
- Text:Needs to be clear, simple and concise so it provides usability and trust.
- Usability:Goes hand in hand with accessibility and allows users to quickly understand and navigate the UI. Products will remain user focused in the future.
There are of course many more principles we can talk about which could influence your online business in the future, but we have only focused on the more generic ones that can be applied to almost any company.
To properly analyse how implementing a new visual language can impact your online presence, we would need to have a more in-depth look at the particularities of your business.
For more information on the web design services that we provide here at Absolute Digital Media, get in touch on 0800 088 6000.