Category

Graphic Design

A Second Look: Trends in Web Design and Development

By | Graphic Design, Web Development | No Comments

After spending many hours online, you naturally begin to pick up on web design’s current (and evolving) trends. By visiting a variety of different web sites and communities, you start to pick out specific differences in layouts and styles of each design you stumble upon; you begin to observe the subtle nuances designers have begun to adopt to put their work above and beyond what we call ‘average’. Incorporating the latest trends through a marriage of coding and design is ever advancing the web and how we view it day-to-day; it’s not stopping or slowing by any measure, and you should be ready to embrace it.

Here are a few trends in web design to keep a look out for (and, if you’re a designer or coder, trends to pick up on).

What Web Design Trends to Watch For

1) Grid Style Layouts

The first time I noticed the wide-spread use of grid based structures was on social media (think of Pinterest, Tumblr, Google + and the like). Most social networks use a grid to help display huge amounts of content in an organized, concise fashion to decrease the chances of user confusion and conflict. This creates a simple user experience that enhances the overall time spent of the site; half the battle is creating a strong UX, let alone one that’s pretty to look at and able to captivate users.

Using thumbnail images with some text displays a tidy way to keep information into a easy to read format. This allows users to flow throughout the site and find what they are looking for without relying on search queries, as was once the trend. This grid based layout has also become standard amongst blogs and personal websites for easy content consumption while remaining auto responsive and flexible.

 

2) Extended Form Elements

Creating a simple experience that enhances the user experience is the key to web design; if it’s not intuitive, it isn’t worth interacting with and probably not worth using. This includes using JQUERY to help write smooth, easily-readable code with fewer lines, and overall, much less clutter. CMS’s have been further enhanced by Javascript and JQUERY  (think WordPress, Joomla, etc.) while keeping websites clean on both sides of the canvas (front and back ends).

These elements, which bring a high level of polish and interactive features, live on some of the greatest sites to date. Viewers are now spoiled with liquid-smooth animations and creative website layouts that we never had the chance to experience before the turn of the millennium. 

 

3) Landing Pages

Although they’ve been utilized by sales peoples for quite a long time (for leads and converting users), landing pages have become a rising trend, featured both on one-page sites in addition to email grabbing pages of large websites. Using this element helps to encourage viewers into learning more about a product or company (while, obviously, benefiting your business by allowing you to capture valuable contacts and customer insights). The idea of landing pages is to create a sneak peak at what the company can provide to various types of potential clients, letting them know what sets them apart from the competition. If the customer opens the door to your website, you want them to walk in and enjoy a hot cup of tea, not run for the hills. It’s all about great, converting copy, a proven track record and a beautiful user experience.

 

4) 3D Transition Effects

I’ve come across many websites that are using 3D effects to display image galleries, navigation menus and text animations. Although it’s a fun, punchy feature to use on your site, designers should be wary of using too many animations on a single page (especially on single page themes; you know who you are!). A common effect used on websites is the scrolling fade transition; this allows information to fade onto the page just as the user is scrolling down or transitioning to another slide/section. Modern design is all about introducing content in a smooth, appealing way, and 3D/parallax effects do this quite easily with little effort or code.

 

5) Flat Design Elements

You’ve seen it everywhere; even mobile devices and operating systems (Metro UI in Windows 8 and 10) have picked up flat, layered design.  More and more web designers are using this element because of the simplicity and the professional polish that comes with design elements that lack the aging effects of typical Web 2.0 treatments. CSS3 allows designers to incorporate flatter buttons, text shadows, and rounded corners to keep their designs fresh, current and consistent; it’s much easier to have your website live as a cohesive unit if the design meshes well.

This feature tells us a lot about the future of not only web design, but of UI design in all devices. Apple, Google and Microsoft are only some of the first adopting fresh colours and simplistic (yet stunning) interfaces that are layered, flat and make use of smooth transitions.

 

6) Portraits

Many portfolio and creative websites are now using portraits to add a human element to their website; after all, websites shouldn’t be websites: they should be the face of your business, organization or belief online. A good way to accomplish this would be to include a simple photograph of yourself on your bio page or in a slider on the home page, or even dedicate a section in your ‘About Us’ section.

This helps the user to get a glimpse into who you or your company is on a personal level, removing the corporate illusion of a single unit. Instead of doing what everyone does with portraits, add some creativity and spice; use hover overs, funny faces, GIFs or cultural/hobby photos. Add some character!

7) SVG Images & Icons

You’ve seen them, and they’re taking over by storm. Vector bases graphics are becoming something that almost everyone web site has, either living as a hotlink to another page or service, or serving as a great way to add visual interest to an otherwise boring section where copy might have been used. They help communicate meaning to a heading, service, or button into a simple icon. SVG images are like vector images but can be manipulated much more easily with the hassle you expect from graphic integration on the web. They have the ability to be selected and edited in most Adobe applications. If you still remember the relevance of flat design today, these vector graphics work very well in such environments.

 

8) Responsive Design 

Many people are starting to use their mobile and tablet devices more often than their computers; its a fact many businesses are trying to cope with. Be it social media or corporate websites and tools, people are flocking to not just one device to consume media and interact with the masses: they’re using 2, 3 or even more. The easy access to things like the Internet and email are a huge factor into why mobile technology is becoming something that everybody on the planet is starting to use. Responsive design works the best when you eliminate the excess stuff and only keep the bare essentials. This makes a simpler design and easy to use for all users. Scaling up for computer size is when information can be added and more design elements can be incorporated.

 

As you can see many of the trends are working together to create the World Wide Web  that we see today. I’m sure that as the web continues to grow and reach more and more people, trends will change and evolve. Will we continue to see flat, layer design, or will the Web 2.0 styling with emboss and gradients come back? Will we seen flash websites take to the forefront, or will clean and simple sites live on?  Who knows. The landscape for web design has shifted considerably over the past few years despite the young age of the Internet itself. As more people search for their next fix online, be it that next hot item or to simple message their friends on the next social network, there will be more options to innovate and push boundaries. What do you think we’ll see next?

Part 2: An Intro to Online Business Branding

By | Graphic Design, Marketing, SEO, Social Media, Web Development | No Comments

Welcome to Part 2 of our Intro to Online Business Branding! If you’re looking for a few tips to get you ahead online, keep reading!

 

Email Newsletters & Social Campaigns 

As you gain customers, be sure to understand that engagement and communication are extremely important. This can mean a larger focus on social media or other channels; if you’re looking to grow your brand online, social media is a must. This ties into brand recognition and your ability to understand and reach out to potential customers. In addition to tapping into social media for its communication prowess, its pretty important to leverage the power of email. The more customers you have online, the larger your potential list can become. Email is not only a way to retain customers, but remind them of your brand and what you offer elusively.

Having a great email campaign to have your buyers or users opt-into can help you acquire more business in addition to reaffirming your brand with useful content and updates about your products and services.

 

Retain Customer Trust

Money’s important; yes, it’s what pays the bills. But don’t forget that your customers don’t want to be reminded that you need their hard earned money. You wouldn’t want someone to push these products or services down your throat.

The secret to selling and maintaining customers is to provide value for the customer through a great user experience (in addition to helpful info) plus building a long term relationship. Look to add value, build trust, and be respectful of potential customers. This won’t only lead to more sales, but will also increase brand loyalty and customer confidence. They’ll look to you because you offer great products and services, but will also because they can trust your name for added value.

Part 1: An Intro to Online Business Branding

By | Graphic Design, Marketing, SEO, Social Media, Web Development | No Comments

If you thought that branding your business in the real world was enough to get you a steady stream of customers, separate you from your competitors and build significant brand equity, you might want to do a double-take.

The Internet has given us the ability to reach more and more interested customers than ever before. However, this is not without costs and sacrifices; it can be a difficult task handling two different branding channels (both online and offline) at the same time. Also, because there are more businesses online than off, you’ve got some steep competition if you want to step into the digital world, especially if you’re interested in e-commerce or retail.

But where do you start? How do you develop an identity online with so much noise, confusion, and competition?

Brand & Mortar has the skillset, tools and experience to help develop your business’s digital identity. If you’re looking to tackle your own branding and identity initiatives, we have a few fundamental branding concepts that might help. Be sure to join us next week for our Part 2!

 

Recognition

Being recognized by users and past customers is the name of the game here; recognition, or the identification from real world to digital. If you have recurring customers offline that attempt to find you through social media or search engines, and they’re met with different branding (or none at all) on your website or social platforms, you’ve already sabotaged your branding efforts both online and off. Customers or potential clients will likely be confused if the branding hasn’t been streamlined enough; are you the same company they interacted with or bought from recently? Unclear branding can ruin your recognition and, at the same time, reduce your credibility (logos, colours, and other design elements that aren’t consistent can appear sketchy).

Sometimes, jumping online can be a great time to rethink your branding efforts; a new logo, social media revamp, and brand message might be options to help define you as a company or influencer in your field. Is your logo too similar to another company or competitor? In many cases, all it takes is a revamped colour palette or minor graphic alteration to your existing logo to make it (and you) stand out, but remember that your logo defines your brand, and if you develop a solid backing, you’re going to want it to stand the test of time.

 

Understanding Customers

You’ll always have competitors. However, the best choice you can make is highlighting your strengths and differences to those of your competitors. Why are your services or products better? Are they of higher quality? Higher value? Do you come to your clients or adjust to their personal needs? Once you know your personal strengths in your ability to manage your business and act as an interface between your services/products and your customers, then you can understand what demographic might be best for you to tackle. You could make the best product in the world, or offer the greatest services ever, but if you don’t know how to target an audience and understand what makes them tick, you’re unlikely to truly reach them.

When a consumer thinks about your particular service or product, you have to make them think about you in particular. What makes you stand out? Where can you build a connection between you, your service or products, and the consumers wants and needs? Those are always tough questions when you’re searching for a better reach, but looking towards smaller, more targeted niches can serve you well. You may find your perfect audience within the one you were previously trying to target, all because you took a step back and thought like a client or customer. A bigger reach, just like in social media, for example, doesn’t always mean better.

Join us next week for Part 2 of our article on online branding efforts for your business!

4 Things To Look For In A WordPress Template

By | Graphic Design, Marketing, Web Development | No Comments

WordPress, like it or not, has become an industry standard platform for everything digital content on the web. Not only are WordPress templates easily tweakable in their current form, but just about anyone without HTML or CSS knowledge can throw up a (rather crude in most case, if we might say) website. Although having someone experienced optimize your content and website for SEO and other tweaks is recommended, WordPress gives you the ability to, at the very least, setup a fully functional blog for yourself or your business.

Read More