Archive for the ‘Digital Design’ Category

Accessibility is key to removing barriers for website visitors with disability

March 12th, 2019 by Erina Hoque

Exploring a website is effortless for many of us (unless you are looking at a very old, or poorly constructed website), but that is not the reality for those with a disability. My recent Accessibility Assessment of a client’s website brought me face to face with this stark reality.

It is important to be aware of the challenges faced by those with a disability, in order to ensure your website is inclusive and accessible to all. Knowledge and understanding of the available assistive technologies also provides helpful insights.

The challenges for people with a disability can be broadly categorized into:

  1. Vision impairments including blindness, low vision, colour blindness. A Screen Reader is a technology that is widely used by the vision impaired. It reads aloud the contents on a computer screen. NVDA is a free and open-source screen reader software. The commercially available JAWS for Windows is another example of a screen reader.
  2. Hearing impairments such as deafness or low hearing. Tools which auto-generate transcripts and captions are useful for those experiencing deafness and low hearing. IBM’s Watson Speech to Text technology is one such tool which converts audio and voice into written text for quick understanding of content.
  3. Mobility impairments e.g. weakness or difficulty in controlling limbs. Speech recognition softwares help users create text and navigate online by speaking into a microphone. One example of speech recognition tools is Dragon Speech Recognition Software which allows users to use voice commands to type and navigate the internet.
  4. Cognitive impairments e.g. learning difficulties, difficulties in comprehension.

Some of the areas of accessibility can be achieved relatively easily for your website via your content management system (CMS). Other issues need a developer to implement the code of your website differently. Still other accessibility issues require consideration during the visual design process.

Below are examples of some easy ways that you can make your website more accessible via your CMS:

  • Non-text content such as images should be accompanied by text alternatives/descriptions to make them accessible to those with vision impairment. These text alternatives are captured and communicated to the user by a screen reader.
  • Including a link to a transcript of any audio content, so that those with hearing impairments are still able to access the content.

Other areas of accessibility can be more difficult to combat via a CMS, for example:

  • Mandatory form fields should be clearly labelled as such, and when users fail to provide input for any mandatory item, information should be provided as text to enable the visitor to identify which fields were omitted. Such error message text should be placed so that screen readers can quickly access that, and read it to the visitor. All visitors will benefit from this functionality, but especially those with cognitive impairments.
  • Ensuring that the content of pop-ups be accessed via screen readers and via the keyboard.
  • Ensuring that identical links are not repeated successively; this causes an issue for a person using your website solely using their keyboard. This can occur unintentionally due to the way a website is designed and then built for mobile responsiveness and with multiple menus. For users of assistive technologies, it can be confusing to encounter successive identical links.
  • Ensuring that there is sufficient contrast between all elements on screen, to help those who are visually impaired to see all information. One example of this which we see on a regular basis due to the cleanness of the design, is placeholder text inside form fields in a light grey (the only guide to a visitor regarding what should be entered into each form field), whilst the information they enter is shown in a darker colour. The lighter text looks nice but is hard for people with vision impairment to see.
  • Video content should be accompanied by captions to assist those with hearing impairment. This is a job for the creator of your video assets.

The above is just a subset of the ways in which a website can be made more accessible for visitors with disabilities – there are many more!

The World Wide Web Consortiums (W3C) Web Accessibility Initiative (WAI) has developed standards and extensive support materials to help understand and implement accessibility. More information is available via:

  • W3C Web Accessibility Initiative website: https://www.w3.org/WAI/
  • W3C Accessibility Guidelines: https://www.w3.org/WAI/standards-guidelines/

The Australian Disability Discrimination Act 1992 requires equal access for people with disabilities. The Australian Government mandated that all government websites must be constructed to comply with WCAG 2.0 by 2014.

Contactpoint would be pleased to assist you with an assessment of your website accessibility issues, or to implement changes to the code underlying your website to ensure that it is accessible.

Facebooktwitterredditpinterestlinkedinmailby feather

Latest trends in website design, and why …

January 22nd, 2019 by Heather Maloney

We have just undertaken the huge task of re-designing and re-building the Contactpoint website. Until last week, our website design was over 5 years old, which is ancient in web timelines, particularly for a web design & development company. Our previous website design was aimed squarely at indicating that we were working with the Windows Metro Tiles in our mobile app designs and builds. The Metro Tiles design style was fairly new at the time, which confirms just how old our site design was!

When you have a large website, with lots of historical content created as a result of hundreds of hours of investment, and when your site covers many areas of endeavour and really matters to the way your organisation is viewed in the marketplace, then refreshing your website is a significant undertaking.

Do you have the impression that your website looks a little out of date, but aren’t sure why? Are you wondering whether it is worth the time and resources required to refresh your website? In this article I will address both of these questions, and of course, I’d be very happy to discuss this questions with you if you need a sounding board.

Current Design Trends

First, let’s have a look at the latest design trends that you will be seeing in the newest websites, and some reasons behind those trends.

1. Cartoon / Hand Drawn images:

Latest design trends - illustrations

It is currently very popular to use illustrations, rather than photos, particularly in software-as-a-service or start-up technology company websites. Illustrations are helpful to convey new ideas without the constraint of a photo, and explain a new concept in pictures rather than lots of words. Similarly, we are also seeing much more use of hand-drawn, unique icons to help direct the user to the right information, and to solidify a point being made. The quirky and hand-drawn style of illustrations and icons make websites more friendly and engaging. You can see this in the icons used on the Yelp website and Slack website for example.

2. Lots of white/empty space providing separation of sections of content, also with less information per section. Both of these visual devices make it very easy for the visitor to take in the content, and focus on the key point/s. The new Firefox website shown above is also an example of this trend. This also makes mobile responsiveness easier, as you have less content to deal with on the mobile, however, it needs to be balanced against the impact on search engine optimisation; Google works out where your site should be ranked primarily on the content you include in your site, so you need to have significant amounts of content.

3. Animation of icons, logos and form fields. We won’t be going back to the days of flaming logos, however, with new programming libraries being created that facilitate easier, sophisticated animations using Javascript, animation is being more freely employed to:

  • provide visual cues to the visitor to suggest interaction points
  • gain the attention of the visitor to more important parts of the site
  • provide a delightful user experience

For a beautiful example of an animated logo, check out: Fubiz (you need to wait first for the whole site to download, and the logo animation doesn’t run constantly so you might need to be patient). The Myer website currently employs an animated logo to emphasise the “My” in Myer matching their TV advertising slogan. The Ikea website uses an animated icon to highlight information about their parcel delivery service.

4. Use of video. Like animation, video grabs the attention of the visitor, and provides for deeper engagement with your audience. The use of drones to create unique footage is also continuing to drive the popularity of video, as seen in the home page element of the new Brighter Lines website.

Video is increasing being used in more subtle applications – backgrounds that automatically play in order to add atmosphere to your website without requiring the user to focus on and listen to audio at the same time.

5. Design for mobile. This is not so much a new trend, but designing for a great experience on mobile devices has become even more important with Google’s recent change to “mobile first” for ranking of websites, whether you are searching via your mobile or not. Not only does your website need to look great on very small screens (and every other size) it must also be very fast to load on mobile.

6. Headings, Headlines and Buttons. Examples of the latest trends in headings, headlines and buttons are shown below. These trends are partly about fashion, but also strive to make text shorter, and calls to action, very clear and obvious. They are used to take the visitor down the desired path.

7. Typography. Choice of fonts has become more important with Google making it easier to incorporate a unique font into your website, without sacrificing load speed or readability. The font used in your website will be focused on ease of reading on screen which is why sans serif fonts dominate. Large fonts, and capitalised headings, are used widely, as shown in the examples above. The space between lines and paragraphs are carefully chosen for readability and aesthetics.

8. Cards, tiles and panels. Google’s Material Design was launched in 2014, incorporating flat design – predominantly solid, strong colours – bringing to digital design the concept of surfaces with edges that guide the user, but can extend based on interaction due to the digital nature of the surfaces. “Cards” and tiles with subtle drop shadows, becoming more pronounced on hover, help to focus the visitor’s attention as well as provide subtle interactivity with your website. Google also provide programming language around the elements of their design system to assist in their implementation. Cards and panels are usually implemented in a grid system, which aids mobile responsiveness. An example of cards implemented by CodePen.io is shown below.

Reddit and other news style sites use this design element extensively.

9. Asymmetrical Designs As a break away from the extensive use of grids and boxes, asymmetrical designs are becoming more frequent. The Cloco website is a great example of asymmetry. Our new Contactpoint home page – custom technology Melbourne with angled background sections are an example, leading the visitor’s eye to want to keep scrolling down to see what comes next.

10. Hardware driving design trends. For mobile app design, the iPhone X requires special treatment due to the “notch” cut out of the top of the display and the introduction of “Super Retina” display. The digital screens now surrounding stadiums such as the MCG and inside the Rod Laver Arena, also drive design changes as they extend the boundaries of what is possible, and increase expectations of viewers.

The above is not an exhaustive list of all the design trends you will be seeing on the web, but it will certainly help you to pinpoint why your site might be looking a little old compared to newer sites.

Why is it important to keep up with design trends?

If you are not in the fashion industry you might question why you need to try and keep up. Certainly, we are not planning to change our website design every time something new hits the web. However, the design of your website, and all your marketing material on and offline, is a powerful indicator of who you are, and who you serve.

The following are important reasons why you might consider a design refresh:

  1. Fashion. There are those who make up the numbers of the “standard deviation” (the outliers who like to start new trends, or go off grain) and then there is the majority; people behave in a tribal way, following the trends of the tribe or group of people with whom they want to identify. The concept of Tribal Marketing asserts that when the trends and look of the tribe that your organisation serves moves, you need to move with them so that you are still recognised as being part of the group and serving that group.
  2. Keeping up. The desire to keep up with the latest and greatest, or not miss out, is a strong drive. Looking outdated can be a signal that your products and services are also not up to date. Depending on your industry, falling behind can mean losing competitive advantage or missing out of value available to others.
  3. First Impression. Research has shown that website visitors make a judgement call about who you are in a fraction of a second. Having a good first impression via a strong website design is important to keep a prospect on your site long enough to find out more about your offer.
  4. Improvements in experience. Most of the design trends described above are not just about changing for the sake of fashion; the changes are part of constant improvement to help guide the people you serve, and want to serve, to action, and communicate your most important messages more clearly.
  5. Communication. Getting your message across – all of your message – can be delivered so much more effectively through design and visual elements, compared to all the words it would take to deliver the same message. The other side of this coin is that your design might be communicating messages to your visitor that you aren’t intending, especially if it has been the same for a long time.

We understand all the steps involved in designing a new look site that appropriately reflects your organisation and positions you correctly for your target audience, and then building your new site to achieve the greatest engagement of your visitors. Don’t hesitate to get in touch to discuss your website or web application design.

Facebooktwitterredditpinterestlinkedinmailby feather

The Latest Email Campaign Design trends

January 18th, 2019 by Heather Maloney

Design trends are a favourite topic for discussion at the start of each year. However, what is possible in the design of an email campaign is significantly constrained by email programs used by the recipient (or at least, the lowest common denominator of email clients). Email design must also ensure a great experience for those reading on a mobile phone, as well as a desktop computer; as of June 2018, 46% of all emails are opened on a mobile phone(1).

Emails from major brands continue to be highly designed, and consist predominantly of all images. It seems that the major brands expect that their customers will open and download the images so that they can actually see the email, without any further encouragement. Less popular brands and professional organisations, however, would be well advised to intermingle images with text and colour blocks that appear without image download, to entice the recipient to read with more than just the sender’s name and subject line.

One of the most popular design trends in emails is including animated gifs to entice curiosity and therefore click through to the organisation’s website. Animated gifs can also be used to better explain concepts inside an email; a picture tells a thousand words. Because you want the animation to surprise and delight, using them in every email you send runs the risk of becoming predictable, so mix it up.

It is also important to note some difficulties with animated gifs inside emails:

  • Unfortunately Outlook 2007, 2010 and 2013 do not support animated gifs, and will show the static version of the animation by presenting the first frame of the animation. That means you need to include all the important information in the first frame, to cater for the high percentage of users still using these versions of Outlook (approximately 8% of the global population).
  • Many frames and complex animations will cause your images to get very large, very quickly. So you should stick to very simple animations.
  • It takes more design skills to create great looking animated gifs, compared to a single static image.
  • Accessibility for the visually impaired can also be an issue. Consider slowing down rapid frame rates, depending on the image.


(image courtesy of Review Australia email)

Including live content in the body of your email – think live results from a poll, count down to the end of a sale or ticket availability, latest content shared by other customers, current weather, something happening close to the location of the opener. Live content is information that is updated when the recipient opens your email. This tactic, if used to provide richer, more relevant experiences for your reader (not just used as a gimmick) will significantly increase the engagement of your audience and possibly aid in community building, and will cause an increase in the number of times that an individual opens the same email. Live content is being seen increasingly in social platforms e.g. Facebook Live where users are streaming video from an event. Live content is also a tactic that you will want to make careful use of, as it can backfire if the live content rarely changes, is of poor quality, or is uninteresting.

The use of live content is likely part of a cross-channel marketing campaign. For example, a physical event, involving sharing of content online, with online ads pointing to the website, and an email campaign promoting the event before, during or after. This trend of co-ordinated marketing across multiple channels has been a goal for marketers over many years, but made difficult by disparate systems. As technology integrations proliferate some of these difficulties are being removed, and the end consumer is seeing the same message in more places, with great effect. Delivering a co-ordinated marketing campaign across multiple platforms – ads, website, emails, offline marketing – requires a lot more design effort and co-ordination across multiple teams in larger organisations, but will produce significantly better results than a message only distributed in one channel.

If you would like help to use any of the above trends in your email marketing, don’t hesitate to get in touch.

(1) https://litmus.com/blog/email-client-market-share-trends-first-half-of-2018

Facebooktwitterredditpinterestlinkedinmailby feather

Case Study: How a Landing Page Rescue Fixed a Leaking Sales Funnel!

June 20th, 2018 by Cameron Collins

fix leaking sales funnelAccording to Wikipedia1, people in sales and marketing positions have been talking about sales funnels since the 1920s. The sale of many products and services involve a lead time from investigation through to purchase. Having a certain number of leads at each stage of the sales funnel or customer journey is frequently used as a lead indicator of your likely sales volume at a point in the future. Marketing attempts to ensure that people entering an organisation’s sales funnel have a certain problem they are trying to solve or need that must be met, and that are aware that solutions to these problems exist. The organisation then attempts to guide the prospective purchasers through their process of research, interaction with the sales team, competitor evaluation and ultimately the purchase of that organisation’s products/services.

A well-managed sales funnel perpetuates interaction with the individuals even after they become clients. Client’s evaluations of the company, employee performance, products and services are ongoing. The sales process should nurture and support clients, leading to repurchase, renewal of contracts and referrals, that is, back to the top of the funnel.

Unfortunately, in practice not all leads will emerge from the bottom of the funnel as clients. Even the best companies will lose a few leads along the way. Astute marketers will be constantly seeking to identify and improve all interactions down through the sales funnel and seek ways to fix common leaks. Improving the efficiency of their sales funnel ranks as the second highest sales priority after closing more deals2.

The Graffiti Eaters is an example of a company who understood the benefits of a sales funnel but knew theirs was leaking somewhere along the way. They came to us with an existing website, Google AdWords campaign, and frequent blog and social media content to target prospects in the early stages of the sales funnel. Relationships with existing clients were maintained through blog and social media content as well as more personalised email newsletters.

After analysing the entire cycle, it became clear that the hole in this funnel was the website. We were able to drive significant traffic to the website of people who were looking to purchase their services via first page ranks in Google search results for relevant search terms. We were able to ensure the Google AdWords ads were displayed above organic search results. We were also able to encourage relevant traffic to click on the ads. However, once traffic reached a landing page of the website, much of the traffic did not continue on through the sales funnel. Potential clients were lost and there was little to show for the advertising expenditure.

Landing pages play a key role in paid ad campaigns; they support the ad with more detailed content, and help the prospect to take action and interact with the vendor. After clicking on an ad, visitors should be directed to a page that provides a clear, specific solution to their problem in a tone and style suitable for the audience type. Once the visitor has interpreted the key messages, that visitor should be guided on how to act on this information. A clear, yet tasteful ‘call-to-action’, such as a form for requesting a quote, a booking form, a request further contact link or the option to make a purchase.

After analysing The Graffiti Eaters website, we found that the landing page provided an unsatisfactory user experience and had significant room for improvement (see image below).

leaking sales funnel

A cluttered appearance, with excessive text, images and animations grouped close together made it difficult for visitors to find the key information. Style inconsistencies throughout the navigation, headings and text provided a substandard appearance which wasn’t appropriate for the predominantly B2B audience. The call-to-action comprising 3 different options was confusing, and on mobile devices, it was only visible by scrolling to the bottom of a very long page.

We analysed the top performing websites in graffiti removal and similar industries which target the same audience. A design was selected which overcame the aforementioned issues (see image below or visit www.graffitieaters.com.au/graffitiremoval/).

leaking funnel

The text was simplified to demonstrate the key points that owners and managers of commercial properties are looking for when seeking a professional graffiti removal service. A video was provided for those who are prepared to spend more time on the page.

We provided a clear call-to-action via the ‘Get it Off Now’ button which leads to a simple form, handling both bookings and quote requests. This button is part of a sticky header, which stays in view while the visitor scrolls down the page. A second button was placed towards the bottom of the page with the label ‘Request a Quote’.

The mobile number listed in the sticky header features click-to-call functionality when viewed on mobile devices. This enables visitors to click on the number and automatically call head office. As with the booking/quote request form interactions, this is linked to AdWords conversion tracking so that we can monitor the number of leads the ads provide.

These changes are part of an overall re-design of the website which is now clean, modern and user-friendly on desktop, tablet and mobile devices, while retaining The Graffiti Eaters unique branding elements.

We reviewed the results of the AdWords Graffiti Removal ad group during April 2018 and compared it with April 2017 when the previous website was in use. The landing page gained an astonishing 242.85% more leads in April 2018 than in April 2017.

To put this into perspective, we compared the conversion rate of the Graffiti Removal Ad Group in April 2018 with global averages for AdWords campaigns across all industries3.

blog-landing-page-rescue-statistics

The campaign for The Graffiti Eaters achieved more than double the global industry average for conversions and more than triple the conversions gained from the previous website. Not only is the client receiving more leads, they are receiving far greater return on their investment.

The effect of the new design was felt throughout the website, with the number of quotes completed increasing by 44.95% and the number of new clients generated increasing by 25.53%. A great result!

The Graffiti Eaters are one of many clients we are proud to have assisted with Google AdWords management (PPC), website design, and sales funnel optimisation.

Contact us to discuss how you can increase sales by optimising your digital marketing.

1 https://en.wikipedia.org/wiki/Purchase_funnel

2 HubSpot

3 WordStream

Facebooktwitterredditpinterestlinkedinmailby feather

Why Rebrand?

March 27th, 2017 by Heather Maloney

image-rebranding-squareThe visual identity (aka ‘logo’) of the Contact Point brand has just been updated, so the reason why businesses rebrand is top of mind. We are rebranding and have updated our logo for several reasons including:

1. To communicate our purpose more clearly
2. Modernise
3. Be more memorable

The Contact Point brand was established nearly 11 years ago. The visual identity of our brand comprises a hand-drawn asterisk; the idea was that if you were looking at a list of suppliers, you’d mark the one you wanted to contact with an asterisk. My Gen Y colleagues look at me blankly when I talk about written lists, and marking one with an asterisk. And let’s face it, we’re a technology company, so what place does written lists have in that? Time for a refresh!

Our business aim is to partner with our clients to help them be the contact point in their industry, by using the best technology solutions and digital strategies.

Our new logo contains a C, a dot / point in the centre, and a circle surrounding it which work together:
– To be easy to recognise.
– The outer circle reflects both the global nature of our work, as well as the team it requires to deliver.
– The overall logo is also reflective of a target. Our clients have goals that we assist them to achieve, and we are about making them the target – the contact point – of the right customers.

We would love your feedback re: whether you feel that our new visual identity successfully achieves the above goals. Stay tuned for our new website design which will better incorporate the new logo, as well as bringing the user experience up to date.

Other common reasons for rebranding include:

4. Change in purpose
Often such a change means that the brand no longer supports the organisation’s purpose.

5. Reaching new markets
New markets usually comprise people with different demographics, pain points, ways of communicating, and perhaps culture. A new brand may be required to better engage with that new target audience.

6. Consolidating multiple brands
Mergers and acquisitions usually combine brands that clash with one another. A rebrand in this situation will help the organisation to present a consistent message to the market.

7. Changing the name
A new name obviously requires a new brand when the visual identity is tied to or incorporates the original name. Imagine if Coca Cola changed their name (not likely given its value!). Their brand would most definitely need to change.

We regularly assist our clients with creating new brands, or refreshing their brand or visual identity. Feel free to get in touch if you would like to discuss this for your organisation.

Facebooktwitterredditpinterestlinkedinmailby feather

Use of Animation in Websites

March 3rd, 2017 by Chris Torralba

headline - website animation
The use of animation in web design is a current trend, although thankfully we haven’t returned to the days of flaming logos. Animations in websites work best when they serve a purpose and enhance the users experience. Adding animation to a website can bring a design to life, even if the motions on the page are subtle. Websites without any animation at all may run the risk of looking outdated. This blog post is going to look crazy busy, and you’d never combine so much animation in the one page, but below we describe the various ways animation can be employed to give websites that extra visual appeal and improve usability.

Attracting attention
Animations can direct the users focus to any point on the screen. As long as there are not many other competing elements on the screen, even the smallest amount of motion will grab attention. This can be used to influence what the user sees, or establish a visual hierarchy pointing them to important points on the website. Visuals like a slow fade, a box crawling in from the side, or a tile spinning to reveal more information are more preferable than the content suddenly appearing out of nowhere. In the example below animation is used to reveal the products tagline followed by a shop now call to action button.
animation to attract attention

Engaging the visitor
Animations can be used to point out possible ways for visitors to engage further with your website. The right animation in the right place can help get your message across and engage users. Animations as simple as changing the look of a button when the mouse pointer hovers over them can make your pages feel more alive and prompt visitors to select press or interact with your content. A good example of this would be an animated call to action button. Such buttons need to be displayed prominently on your website. Adding [restrained] animations make them more obvious and will let users know that they are interactive. In the example below when the mouse is hovered over the button not only changes shape and colour but produces bubbles as well.
Button hover effect

Web Forms
Animations when used correctly allow designers to produce faster, easier to use, and more productive web form experiences. Animating web forms is a great opportunity to add some subtle and interesting effects to a web page. Web forms are elements that your user will interact with and making them fun to use can enhance the experience. Because animated visuals can teach more effectively than words or static images animations can also be used to show a user how to fill out a web form, subtle animations can guide user interactions and make form filling less confusing. In the example below animation is used to let the user know when his details have been correctly processed.
Web form animation

Visual Appeal
Whilst animating for the sake of beauty can be easily overdone, making the user experience that bit more enjoyable or sophisticated will help to bring your visitor back, and help to encourage sharing of your website. Below is an example of a very subtle animation that just adds some class to the design of the image link.
animation for visual impact

What’s your favourite example of animation?

Facebooktwitterredditpinterestlinkedinmailby feather

Design-centric Application Development

December 6th, 2016 by Heather Maloney

Design-centric application development

A design-centric approach to application development (that’s web applications and mobile applications – is there any other sort these days??) differs from customer-centric or technology-centric approaches which have been more common of recent years. A design-centric approach focuses primarily on ensuring that the user experience is perfect – or perhaps more accurately “nearly perfect”.

There is always room for improvement – another revision, a new update – and users want continual improvement to make their life easier. User experience has been made king because research shows that organisations which focus on design significantly outperform those who don’t.

In a customer-centric approach the customer is asked what they want, and then the designer will set about delivering to their requirements. In a technology-driven approach, the technologists build the best algorithm or new solution to solve a particular problem and then look for a customer who values the technical solution. However, following a design-centric approach the designer will research the best current solutions in the problem landscape, put themselves in the customer’s shoes, and determine to provide the simplest way to achieve the desired goals. Gathering feedback on the design from a variety of potential users of different levels of expertise follows, and leads to iterative refinement until the first version is achieved. The developers – the people who turn the design into reality – are then directed by the design team to ensure that the intended outcome is achieved.

The Uber mobile app is a great example of design-centric application development, which is a significant factor in its amazing success. Anyone who has used the Uber App will agree – from being able to see where the on-approach vehicle is on the map, along with the number of minutes until it arrives continuously updated until arrival, to seeing a photo of the driver and vehicle, one press to make a call to the driver, and immediate payment upon arriving at the destination without needing to handover a credit card. I could go on and on about the ease with which you can hail an Uber, and receive a brilliant experience of private transport…

One of the challenges of current application design is dealing with content. Having little visible content is a very quick way to send users heading for the hills … imagine Instagram with no photos when you launch it, or Twitter with no tweets to read, or Facebook with no posts. However, masses of content with no simple way to navigate it, can be just as off-putting. Requiring a user to search has been the standard approach for many years. Filtering and other ways of helping the visitor to easily drill down to the content they are most interested in, have developed more recently.

At Contact Point we have been embracing SCRUM methodology across our organisation, which also readily supports a design-centric approach. Starting with our client’s goals and objectives within their particular competitive landscape, and their customers’ wants and needs, we will:

  • undertake research into common solutions to the design problem at hand,
  • brainstorm other potential approaches with trusted and experienced colleagues,
  • wire frame the potential solution, getting feedback along the way,
  • apply creative design to the wire framed solution,
  • carry out user testing of the design, iterating as necessary to refine the solution, and
  • finally develop the solution, taking care to ensure that the essence of the planned user interaction is achieved

The above steps will be undertaken for each logical entity that collectively forms the solution, at the same time ensuring consistency throughout the solution as appropriate. After the development of each component, real user testing of people across a broad range of skill levels, will then lead to further refinement. Programmatic A/B testing will allow two or more potential solutions to be tested head to head to ensure the best solution evolves.

The successful execution of a design-centric approach involves many steps, and requires an appetite for iteration, well beyond the launch of a new solution. However, the results are impressive, and for all but the simplest of tasks, likely the only way to achieve raving fans of your solution. Design-centric doesn’t mean that the customer is ignored. In fact the opposite is true with a greater focus on experience combined with needs and wants. Neither is technology ignored – utilizing the most up to date and elegant technology is also paramount to ensuring a great user experience.

What is the best user interface you have experienced from a web or mobile application?

 

Facebooktwitterredditpinterestlinkedinmailby feather

Consumer Decision Journey – throw out the Sales Funnel model!

November 8th, 2016 by Heather Maloney

image-consumer-decision-journey
As the creator of a broadly used email and SMS marketing solution (eNudge) for the Australia marketplace, I thought that over the years I would see a general improvement in the way email marketing campaigns were constructed and delivered. I’m sad to say that on the whole, nothing much has changed. eNudge provides a myriad tools to help you segment, target, automate, measure and analyse, but it’s in the execution where many people fall down. Business owners and marketers get busy, and then just flick off a quick email to get a spike in sales. They are content with a spike and move on.

However, I know there is a better way … there always has been. Many marketers refer to it as lead nurturing, and email campaigns (including the eNudge Message Series functionality) are an excellent way to nurture your leads. For many years, marketing personnel have been working with a Sales Funnel model in mind – a linear movement of a potential buyer through awareness, interest, desire and finally action (buy). Lead nurturing refers to understanding where your lead is in the sales funnel, and give them the next piece of information that they need to take them to the next step in the journey; the next step closer towards being ready to buy.

I could be placated if I saw email marketing being used more for lead nurturing … more value and information being supplied, in a logical flow, engaging with potential buyers and taking them down a path to understanding and trusting you. However, thoughts even on lead nurturing have moved on …

The changing landscape of information availability via the internet including the impact of social media, and more recent research into buyer behaviour, suggests throwing out the sales funnel model and replacing it with what is being called by McKinsey as the “Consumer Decision Journey“. McKinsey research revealed that far from systematically narrowing their choices, today consumers take a much more iterative and less reductive journey of four stages: 1/ consider, 2/ evaluate, 3/ buy, and 4/ enjoy, advocate, bond. During stage 2 (evaluate) where the Sales Funnel approach says the the options get narrowed down, this in reality is where the brands most active online often replace the brands that were in the original consideration list (perhaps added to the list because of traditional advertising). The consumer’s options actually expand during this phase and the originals often get thrown out where there isn’t enough information online or customer reviews to support them.

Even more critical in what is being seen now in consumer behaviour, McKinsey discovered that during the 4th stage (enjoy-advocate-bond) more than 60% of consumers conduct online research about the products after purchase – a touch point entirely missing from the sales funnel approach. It is during this after purchase where your customer will advocate for your product or service by word of mouth, and produce online content to help future consumers in the consider and evaluate phases.

Other recent research by the Harvard Business Review team has shown that achieving the “full” sale to a B2B client is best achieved by providing the opportunity for that client to purchase small prototypes or incremental products along the buying journey i.e. as part of the evaluate stage. For more about this read: “To Increase Sales, Get Customers to Commit a Little at a Time“.

It was no small task, but the Harvard Business Review article describes an example implementation of changing the view of marketing to that of the ‘Consumer Decision Journey’ lead to a new TV becoming the top seller on Amazon.com and the company’s best performer in retail stores, far exceeding the marketers’ expectations.

To ensure that your product or service is not thrown out by prospects during the Evaluate phase of the consumer journey, and to help new customers to Enjoy, Advocate and Bond:

  1. Make sure your product or service is present online, not only in your own website, but also in comparison sites and marketplaces (for B2C) and online communities (for B2B)
  2. Foster online reviews of your products and services via social media and 3rd party websites
  3. Provide rich and easily accessible information online for people who have already purchased your product or service to help them get the most out of it
  4. Introduce new ways to inspire existing customers to refer their friends and colleagues to you – think DropBox who give away additional storage space for referring business

Your email marketing activities should assist you with with each of the above. Email campaigns should be created specifically for new customers and should point to additional online resources, and specifically ask for reviews or feedback. Email campaigns to your wider database should reference case studies and additional information available to help prospects in the evaluate phase.

If you need help with:

  • creating incremental or prototype products to sell to your clients as they evaluate,
  • creating additional online content,
  • making your online content more engaging,
  • ensuring you have a vibrant social media presence,
  • ensuring your product or service can be found easily online (SEO), or
  • creating email marketing campaigns that engage,

don’t hesitate to get in touch.

We are passionate about helping businesses to grow using online technologies.

Facebooktwitterredditpinterestlinkedinmailby feather

UI UX Design Trends in 2016 and beyond

June 14th, 2016 by Chris Torralba

image-ui-ux-design-trends
A Google search of the definition of ‘user experience’ returns: the overall experience of a person using a product such as a website or computer application, especially in terms of how easy or pleasing it is to use.

The definition of user interface is the means by which the user and a computer system interact, in particular the use of input devices and software.

Clearly user experience is significantly impacted by the user interface design, but it is also affected by text content and process flow. The overall aim is the creation of websites and apps that provide unique and clean designs, communicating clearly with the user, which not only attract users, but make them want to come back. User interface design uses typography, colour and layout to create the best possible user experience. Below I have described 7 user interface design trends that contribute to a great user experience and which I expect will be very popular this year and beyond.

#1 Responsive Design

Responsive design takes a website and re-arranges and resizes certain elements to display better depending on the size of the screen being used to view the content. With the enormous uptake of mobile devices for internet browsing, responsive design is becoming less of a trend and more of a common practice when it comes to web design. Last year Google announced that mobile responsiveness will affect a websites rank in search results, making responsive design a must have. “Starting April 21, we will be expanding our use of mobile-friendliness as a ranking signal. This change will affect mobile searches in all languages worldwide and will have a significant impact in our search results.” You can read more about this announcement in our previous blog post: Mobile Responsiveness just became even more important for high ranks in Google and you can read more about responsive design techniques.
image-responsive-design

#2 Flat Design

Flat Design is a minimalistic approach in designing websites and user interfaces where all 3D elements, gradients, shadows and other effects are stripped away. Flat design is about allowing the content to speak for itself. By removing unnecessary styling, it makes for faster loading pages, simpler code, and adaptability. Whether viewed on a desktop or on a mobile screen, flat designs are always legible and adaptable.

Below are some examples of flat design icons.
image-flat-design

#3 Material Design

A few years ago Google introduced Material Design which is a design philosophy, or more simply put, a style guide for designers to follow. The name “Material Design” is a metaphor for physical materials (such as paper) which have thickness and are impacted by light sources such as directional light and ambient light, and content which is placed upon the materials. The style guide seeks to apply the rules of physics to the way material is depicted in designs, and the way content is placed upon it. Based on these guides, the goal of Material Design is to allow a unified experience across all platforms and devices. It breaks down everything from colour palettes, font choices, spacing, and animation. Just like flat design, Material Design is also content focused. The popularity of this minimalistic design approach will continue to increase as it makes a website or an app look cleaner and load faster by taking out unnecessary elements.

You can view Google’s complete guide to Material Design here.
image-material-design

#4 Card Style Layouts

Card style layouts for mobile and desktop websites are boxed pieces of content that looks like it is featured on a playing card. Card style boxes typically hold one unique piece of content or information. The Card style layout is a great way to organize large amounts of content. It is highly functional and can be easily integrated with responsive layouts; designers can add and collapse columns of cards to fit the shape and size of the screen. Card style layouts have been steadily growing in popularity over the past few years and developing together with other techniques such as responsive design and flat design.

Below is an example of a website designed by Contact Point which uses card style layout. Read more about in our Henry Langdon website case study.
image-card-style-layout-2

#5 Dramatic Typography

Today’s minimal and streamlined web and app designs allow typefaces to be more dramatic and have stronger impact. With free type kits like Google Fonts, designers and developers are able to use fonts that look great on all screens.
image-typography

#6 Large Background Images & Videos

One way of making a website stand out is by having great imagery displayed prominently. Large background images and videos can help engage users more; it is captivating and focuses attention on the content. With browsers supporting HTML5 video, increased bandwidth, the popularity of background images and background videos on websites will grow even more.
image-large-backgrounds 2

#7 Greater Use of Animation

When used in the right place and at the right time, animations can truly enhance a users experience and it can convey a message more effectively. Well executed animations can help guide and offer context to the user. Conversely, too much animation or transitions can disrupt the flow and distract the user from an otherwise good digital experience.

The Mollard website designed by Contact Point using parallax techniques is a great example of the use of animation.
image-animation-2

Let me know if there are other UI / UX design trends which you believe I’ve missed!

Facebooktwitterredditpinterestlinkedinmailby feather

Enhance your website with animated graphics

September 2nd, 2015 by Tamar Smart

In my early years as a Graphic Designer, I worked a lot with incorporating animation onto a website via Adobe Flash. This was all the rage back then – mostly for use within large banner images/dynamic elements. Over the years, Flash became outdated and impractical, especially with the introduction of Apple devices and their lack of support for all Flash animation files.

Finally animation on websites is making a comeback, but in a slightly different form. Animated graphic files can be created as a Gif image, using HTML5, or a video animation embedded into a website. These formats are supported across a wide range of devices too, which is great news.

Animated graphics can really bring life to an otherwise plain website. They can be eye catching, entertaining, informative or tell a story.

One particular favourite style of animated graphics, is called “whiteboard animation”. This style looks exactly as it sounds – a series of images and text are “drawn” onto a whiteboard, and wiped off or moved around on the whiteboard. This type of animation really works when there is information to explain or a story to tell – it feels natural and makes sense to a viewer. The reason for this is because, when we want to explain something to someone, we often write or draw rough sketches on paper.

As I was browsing the internet today, I noticed that Google had created an animation in whiteboard style. Google has just created a new logo, and used the animation to tell the story of how it was created (in basic dot points). The animation works really well – it’s eye catching, a little bit fun and it makes sense.

New_Google_Logo

In case you missed it, here is a link to view Google’s animation explaining their new logo:
https://g.co/doodle/xfnz5b

At Contact Point, we have recently created video animations for our clients to help engage with their audience, and welcome the opportunity to create an animation for your website also.

Facebooktwitterredditpinterestlinkedinmailby feather

Subscribe to our monthly

Contactpoint Email News

Our enews is sent out approximately monthly, and contains information on latest digital technologies, and how these can be used to help your organisation grow.

To subscribe, simply fill in your details below: