Trends in video background web design

In 2012 we designed and made the Supafonica website with a background time-lapse video of London we made earlier, along with a customised music score to match. As internet speeds for consumers are increasing, browser technology advancing, along with capturing HD quality videos easier, it’s no surprise that the popularity of video background websites are becoming more popular. As we sit in the early part of 2016 we have decided to write up a quick brief of best practices and guidelines for this increasing design trend we were amongst the first to pioneer.

The benefits of background videos are clear to see, matched with audio you are able to present a clear vision of your service or product, how you work, and other important factors you wish to highlight and address to end users. Your brand that is so vital to your business can be strengthened and harnessed. However you must pay close attention to details and visuals in order to give the impression that your company cares and “who you say you are”, therefore working with a creative agency that can deliver would be sensible.

Partial height videos are often used because it may be more sensible to limit the height, for example giving access to the rest of the web page. Another popular trend from designers is parallax scrolling, with the video BG fitted to the divs page. The design often runs without any problems and scrolls just like naturally content. If you do not have any skills in coding and are not a creative agency like ourselves, then investing in a plugin can be the simple solution, however there is the fact that there aren’t many other solution plugins out there available so your options may be limited.

What we see lacking out there today is the lack of usage of audio, this can be a very important element to broadcast your story and vision. Audio can be initiated only from an end user, more so giving your website that extra leverage advantage. Yet we see so many websites and agencies missing out on this opportunity. We at Supafonica recognise this and have built our in house team of music audio producers to help fulfil this role.

The trends of background video have edged closer to modern website design, and although static image backgrounds are still far popular and common we see video backgrounds as becoming increasingly popular with increased support form the developer community, along with easier methods of implementation and build. Matched with the correct audio, we see this trend as staying.

Google are making earth maps look even more beautiful.

From now the tech giant will improve the images that are used for both its Earth and Maps services. Starting this week, Google will be bringing users an even more beautiful and immersive experience with brand new imagery from Landsat 8 satellite, as well as a bunch of new image processing techniques to make images look sharper and even more realistic.

Chris Herwig, the Program Manager at Google Earth Engine, explains that some images often arrive that are cloudy. So the team has been looking through millions of images to find the clearest pixels so that they can “stitch” together lots of different images and create the best possible finished picture.

Enlisting the Landsat 8 images is also part of the plan to make Google Earth look even more breath-taking. According to Google, the satellite is capable of capturing images with “greater detail, truer colours, and at an unprecedented frequency”.

Why not see for your self and check out the new imagery and see if it’s really all it’s cracked up to be by opening up Google Earth, or alternatively you can simply turn on the satellite layer in Google Maps.

Have fun!

Changing face of web design

Recent innovations in web design such as developments in code, strategy & accessibility have shown a threat to webdesign as of the past, we recently read an article expressing the end of web design as a result of fashions in UI & UX. Some suggest that from this point there is no need to be creative as there are no further innovation possibilities & some even stating trying to get more creative can be pointless & harmless. While we agree that platforms, premade templates & a shift towards minimalist white design have made it more easy & accessible we don’t agree that this will be the complete end of website design.

The popularity of mobile & tablet devices have led to terms being created such as UI, & UX. Sergio Nouvel in a recent article on UX magazine expresses his concerns over how mobile is killing the web indicating in particular given the size of a mobile screen there are only so many things that can fit & be included. While we have experienced this in our agency first hand years ago when the emergence of apps on mobiles came around, we like the fact mobile interfaces & apps force you to take you to the bare minimal requirements & start from fresh. Because there is limited space on a mobile designers are presented with a new challenge, this is where the simplicity of design & UX really come into effect.

Certainly the emergence of social media platforms & the fact that a lot of business have started purely & rely on social media, you could argue the need for a website these days & more of a focus on brand establishment. Given trends you can say social media platforms & directory websites like Yelp, which work by a push-based content consumption model where content is being delivered to you based on context, are going to overtake the current paradigm of actively going to a certain business’s website to intake information. Webpages still remain a focus for informative resources, & as websites are still conceived on a desktop device which are much bigger than their new counterparts, we think there will always be a case for website design as long as the working environment revolves around larger screens.

Good websites do not necessarily mean relying on flat design, whilst we are a fan of flat design & minimalist approach, there’s plenty of scope to be different from the rest which is what we try to do. If anything simple flat design should ensure that the real creative agencies & individuals are easier to find & given more prominence as eventually good design will stick out from the rest who are simply following fashion trends which is not particularity difficult to do.

Today websites are apart of a larger ecosystem, with company’s brand identity & consumers at the center. Delivering an experience that’s rich & engaging is ultimately as important with making sure content is very easy to understand & get across to the end user. Simply making sure you have a nice looking website is not enough these days. Consumers are more alert & experienced to be fooled. For example is the content easy to understand? Is it easy to find? Is the identity of the business something your target end users can identify with and connect with on an emotional level & intellectual level? Are you excluding a large chunk of your audience by not paying attention to certain issues such as responsive design or accessibility for disabled users? All of these questions and more should be included & thought about in a business’s complete strategy.

Is Flat UI Design For You?

As technology and the familiarity with it grows, designers and developers are now more than ever trying to enhance the website design world. Inevitably, this leads to countless passing trends that come and go much like any design industry. Which leaves us begging the question, how do we know what is more than just a trend and does it fit our website needs?

Flat design has been a fairly controversial topic since the beginning. Industry leaders such as Microsoft, Apple, and Google have all jumped on board lending us to believe there may be something more to this. So how can flat design benefit your site?

“Flat Design Is Responsive Friendly.”

More and more we are finding people are using smartphones as a replacement for their computers. In 2012, more tablets and smartphones were purchased than computers. Because of this, responsive websites have now become a necessity. With the simplistic nature of flat design sizing elements down to fit a mobile device or tablet becomes that much easier. By using a lot of white space and large buttons flat design becomes very flexible when considering responsive website.

“Flat Design Is Content Friendly.”

The mystery of, “What is more important? Content? Or Design?” has been solved. The answer is neither. Both equally important. Design attracts your users, but your content keeps them on your site. So why would you not leverage your design to showcase your content? Flat design’s clean and minimal layouts provide an environment that allows your content to stand out. Content communicated in a simple and clear manner is more easily digested by the user.

“Flat Design Is User Friendly.”

Although minimal, flat design has a high level of focus on aesthetics generally utilizing bright colors and large imagery. This coupled with the elimination of borders and shadows entices the user’s eye to flow across your site with ease. Flat design strips down to the most basic form of design that can be appreciated by anyone.

The goal for any website design is to carry the message of your business across to the user. Your design should always highlight the content and focus on the user’s experience. Here at Supafonica, we are constantly researching design trends and movements to ensure that our client’s websites are ahead of their time and solidified as legitimate marketing tools. Our team conclude that flat ui design is not just a passing fashion trend, but here to stay with us for a long time to come.

What makes a good end user experience?

Designing for a good user experience comes from years of understanding & working in the field. A designer must take into consideration the end user, their previous experiences with similar products & the end users’ own expectations. The team here at Supafonica adhere to trial & tested methods, such as our own incremental progressive design practices, to further enhance our overall end product. What this means for our clients is through trial & error, & adhering to values which we hold high, we can build beautiful end user experiences.

An example of taking into consideration users’ previous past experiences with similar products is that in today’s world the fashion when it comes to websites & apps is one which they are allowed to get in an instant of pressing a button, or within one or two steps of an interaction with their phone or computer. Because of their previous experiences they demand, want & expect to get everything at a click of a button. You could say that technology has made them spoiled to a certain degree, but such is the state of the advances in technology we don’t really blame them! It’s this fashion, listening, understanding & tapping into which makes our approach to work different to anyone else. We are methodical & precise when it comes to making our own research!

We adhere to & hold high secretive methodical steps, created & pioneered by us, to greater improve efficiency of work load. An example of this is placing special emphasis on research right at the start of every project. We aim to fully engage with our clients, to get a better understanding of their requirements. Where needed we give free business consultation advice, which includes how best we can improve a service or product, & what areas are we likely to greatly enhance. We are not afraid of pointing out mistakes & only take on projects that we know that we can improve further.

Only then can we start doing what we do best! 🙂


UI vs UXD: Understanding the differences

In today’s creative and technical environment, the terms “UI” (User Interface) and “UX” (User Experience) are being used more than ever. Overall, these terms are referring to specialties and ideas that have been around for years prior to the introduction of the abbreviated terminology.

But the problem with these new abbreviations is more than just nomenclature. Unfortunately, the terms are quickly becoming dangerous buzzwords: using these terms imprecisely and in often completely inappropriate situations is a constant problem for a growing number of professionals, including: designers, job seekers, and product development specialists. Understanding the proper separation, relationship and usage of the terms is essential to both disciplines.


UI != UX

The most common misconception that you will hear in the workplace, in client meetings and often in job listings or job requirements is the inadvertent combination or interchange of the terms. In many cases, the incorrect expectation is that an interface designer by default understands or focuses on user experience because their work is in direct contact with the user. The simple fact is that user interface is not user experience. The confusion may simply be because both abbreviations start with the letter “U”. More likely, it stems from the overlap of the skill-sets involved in both disciplines. They are certainly related areas, and in fact many designers are knowledgeable and competent in both.

“UI refers to the aggregation of approaches and elements that allow the user to interact with a system.”


However, despite the overlap, both fields are substantially different in nature and – more importantly – in their overall objectives and scope. User interface is focused on the actual elements that interact with the user – basically, the physical and technical methods of input and output. UI refers to the aggregation of approaches and elements that allow the user to interact with a system. This does not address details such as how the user reacts to the system, remembers the system and re-uses it.

Such problems bring us to the user experience. Don’t be fooled! User experience is much more than just the end result of user interface. Instead, I have always found it best to consider user experience as the reactor or nucleus of a brand. A brand being, in essence, the sum of the experiences that a person has with a company or organization. User experience is the goal. Not just the goal of an interface, but of a product or interaction with an organization. When good user experience is achieved, every desirable or positive effect that one could possibly think of flows from it. UX is focused on success of the whole. In reality, the product is not the sum of its parts; the experience is.

“Consider user experience as the reactor or nucleus of a brand”


At the end of the day, that is all we get to leave the user with: a memory. As we all know, human memory is astounding but it’s imperfect. Every detail contributes to the ingredients of a good user experience, but when it all comes down to it, the user will remember products in somewhat skewed way. UX contains a much bigger picture than UI does but it still relies on the smallest details to drive it. This understanding is the most powerful asset anyone can have in product development.

UI is a Tool

User interface is one of the most powerful tools at our disposal in the quest for great user experience. Why? Simply, the interface is the most tactile, visceral and visible method with which our users interact with us. UI is the front line. This is possibly the best explanation for why the two terms are so often used interchangeably or combined into one.

Incorrect Usage is Dangerous

Communication is complex and can be confusing. The development of precise and specialized terminology facilities easier communication. But what happens when we are effectively not speaking the same language?

“Unthinkable amounts of time and money are spent to dance around the incorrect focus and usage of these terms.”


What if I said, “Use a screw” meaning a corkscrew metal fastener to an engineer assembling a product, but he thought it referred to an angle bracket or chemical adhesive? The product might have some serious problems. Granted, interfaces and experiences aren’t going to literally blow up in our face. However, the effect is no less powerful. Unthinkable amounts of time and money are spent to dance around the incorrect focus and usage of these terms. Eventually, wasting time and money will put a company out of business or cause products to fail. Improper application of the concepts can be disastrous.

Finding the Right Designer

Some of the most common usage failure for the UI and UX terms is where it matters most: job listings and requirements. It is already difficult to locate excellent candidates for specialized jobs such as interface design and user experience design. But it’s certainly more difficult to hire the right person for the job when the skill set and design focus are miscommunicated. It’s expensive to hire a specialist, and it’s even more costly to hire one that cannot solve the problem you need solved. More often than not, the job requirements and responsibilities are skewed toward the UI designer job description but come loaded with the responsibility and expectation of a UX designer.

Responsibility For the Problem

Whether a UI or UX designer, there is still the element of design. Design is a solution to a problem. When roles are clearly defined and universally understood, it’s much easier to attack a problem, propose a solution and execute on it. In the case of UI and UX, the problem normally applies to situations where the responsibility for the interface and the experience is assigned to one designer who simply does not have overall control of both aspects.

It’s tough to own up to a problem when the ability to solve it is not in your hands. A UI designer may have the ability to create interactive designs, icons, colors, text, and affect a number of other elements that solve problems dealing with direct interactions to the user. Those elements are fantastic tools to affect user experience but they are only part of the equation. The user experience is influenced by a multitude of things such as marketing copy, speed, functional performance, color scheme, personality, customer support, set expectations, financial approach, visualization… well, you get the idea.

“It is not that one designer cannot handle both areas. It is about the tools and ability to problem solve”

It isn’t fair or practical to tell the UI designer that they are responsible for all these things and more. It isn’t that user experience cannot be designed. If the situation were reversed for a UX designer it would be equally difficult. In order for a designer to rightly take ownership of the UX problem, they must be enabled to recommend and effect changes, implementations and decisions that control the experience. The flawed understanding is about designer focus and scope. It is not that one designer cannot handle both areas. It is about the tools and ability to problem solve. Effectively, a builder without any tools is just as powerless to build as a person with no skill or knowledge.


The first step to successfully attacking any problem is to understand what must be done. Understanding the difference between UI and UX is an intellectual asset with staggering ramifications.

From hiring the right person for the job to simply understanding what is required to approach the problem, proper knowledge of the UI and UX terminology is a simple way to facilitate better communication, better problem solving, better design and better user experience.

Say hello...