Andi Witmer

About Andi Witmer

Andi Witmer is an interactive designer at Matrix Group. Andi brings great talent and experience, which helps make our clients' sites look simply stunning. She has a BFA from James Madison University, and brings to Matrix Group seven years of experience, including two years of interior design.

Design Trends for 2016

It’s that time – time for me to pull out the crystal ball and predict what will be the big trends that are going to hit the design world next year. 2015 was quite a year, and as we all know, the pace of change only accelerates. So here is my forecast for what we will see, design-wise, in 2016:

Mobile First

2016_trendsTraditionally, given that we are predominantly a web design agency, the very first thing we design is the homepage desktop view. The responsive and mobile user interface (UI) was something that usually came towards the end, after we had addressed the desktop experience. This has been how the industry as a whole has always done business, even though all of us have been talking “mobile first” for some time now.

But lately, we’ve been receiving projects where our clients are getting in on the trend and want us to consider the mobile experience first. Based on analytics analysis, we are seeing an exponential growth in mobile traffic, even from what we could consider a more conservative, office-bound audience. So now we have the data and the mandate, we need to switch gears as an agency and carefully consider the needs of our customers in a mobile context and design accordingly.

More Video Content

After the redesign of our company website, we again took a look at our analytics to see what people were clicking on. What we learned is that people love our Matrix Minute videos more than our static content by a pretty big margin.  We also learned that video content does not have to mean slick, well-produced motion reels, but rather, small, intimate, focused clips. The rise of video usage on Twitter, Snapchat, Facebook, Instagram, etc., certainly points to an audience that would rather watch a video than read five paragraphs of text.

So for our clients, rather than thinking of all the copy you will need to write for your next website or blog post, think instead of what video you will shoot.

Wearables Are Here

The wearables market has been around a few years, with early adopters being Pebble, Fitbit, Nike and others. But now that Apple jumped into the wearables market with their Apple Watch, a lot more attention has been paid to what is still a fairly untapped, undeveloped space. What does this mean for our clients?

In the same way that smartphones have changed the way in which customers interact with brands and services, wearables will soon have a similar impact. The way in which your content is constructed will have to change and adapt to this new, and very intimate, platform.

Micro-Interactions

Somewhat related to the wearables trend, there will be an even greater focus on micro-transactions. We do micro-interactions all the time, when we “like” something on Facebook or even turn off the alarm on our phone. Apps, and now wearables, are designed for multiple “touches”, where we:

  • Communicate a status
  • Give feedback
  • Manipulate anything to trigger an action

While we tend to do these actions somewhat automatically or even unconsciously, they are important interactions with your services and brand.

So, rather than thinking of a user engagement as a long, involved session that lasts for hours, think of these micro-interactions as “touching base” with a user on a constant, consistent basis.  We need to plan for, and design, these “touches” with care, and integrate them into an overall engagement strategy.

Natural Motion Interactions

We have lived with the keyboard and mouse for decades now, and we have suffered the consequences: carpal-tunnel syndrome, repetitive stress injuries, and the like. Hopefully for not much longer! With VR headsets like Oculus Rift, hologram-based systems like Hololens, and gesture-based controllers like Leapmotion finally getting ready to go mainstream, we hope we can finally toss our keyboards into the recycling bin.

What this means is that now we have to take into account and design for new ways that customers will interact with content. From full, 3D, immersive environments to speech and natural gesture based systems (think Iron Man and Jarvis!), our user interfaces will be even richer, more complex, and engaging.

Animation to Strengthen Brands

Animation is going to become ingrained in more and more brands and their respective style guides. Many major brands like Google, Microsoft, and IBM already have strong animation rules in place – IBM’s animation library is a great example. We’re going to start seeing these practices trickle down to a wider range of companies now that they’re more accessible and easier to develop.

Adding simple animation transitions is a great way to add more personality to an already established brand, strengthening the message you’re trying to convey. Say you want your site to feel friendly and welcoming; you might want to add a subtle bounce effect onto page elements as they load. Or, if you want a calming, tranquil vibe, perhaps you’ll have images slowly fade in and drop down. At Matrix Group, we’ve been making heavy use of animate.css on our client sites and can’t wait to take things even further in 2016.

What design trends do you think will take center stage in 2016?

Why Responsive Icons are Awesome

As web designers and developers, we love icons. They share so much information without ever having to resort to words. Don’t you agree? But in a time where more and more consumers are accessing websites via mobile devices, the icons we’ve used for so long may not look that great.

svg_soc

One of the problems that can happen with icons is that they can get blurry or distorted when you maximize your browser window or view a site on a phone. Let me tell you that as a designer, this is a problem. Blurry and distorted is bad.

A solution for this is responsive icons. You’ve definitely seen it, but you probably had no reason to notice it. That’s how you know it was done right.

In short, the larger the viewport’s size, the larger the icon. When you view it on the smallest screen available, the icon will show fewer details and scale to the appropriate size. Not only will it fit your screen, it will be sharp. You’ll definitely notice if it’s not a responsive icon. I promise.

Some image files are better than others for this purpose.

You’re used to .gif and .jpg files, and they’re good for what they are: pictures and larger-scale graphics. .png files are a good fit here, but get familiar with .svg files. They’re vector files, which means they’re infinitely scalable and will look good on whatever device you’re using.

With most of the world accessing the internet primarily on their phones, you’re going to appreciate the beauty of responsive icons and how much time and money they’re going to save you.

The Apple Watch Has Arrived

The Apple Watch has finally broken ground! With its release on April 24th, it has taken the world by storm.

smartwatch_SMWhy do we love the Apple Watch? It is a landmark creation for the tech world. Apple is continuing to push the envelope with its new line of wearable tech.  The idea of having a mini-computer on your wrist is a phenomenon within itself. With three distinctive collections, the possibilities are limitless. The Apple Watch embodies innovation and allows its consumers to personify it too.  It has retained several functions that accompany the iPhone, along with some upgrades.

We already have some favorite functions, like:

  • A smarter way to look at fitness. Living in the health-crazed culture of the 21st century, we love how the Apple Watch has enhanced our well-being. It provides a complete illustration of your all-day activity. It motivates you to sit less, move more and get additional exercise. You simply cannot compete with that!
  • Communication is made effortless. With the hustle and bustle of our daily lives, we are always looking at ways to buy more time. The Apple Watch grants you that by making communication easier. It can predict what you want to say from the context of your text message and allow you to answer phone calls or transfer them to your iPhone.

Tell us what you love (and don’t love) about the Apple Watch!

The Evolution of UI Design: back to skeumorphic?

UI design has been evolving recently, and that has a lot to do with Google’s new Material Design Language that debuted last year. The concept is inspired by traditional ol’ paper and ink. Google interfaces are now more three dimensional with each component on its own “physical” layer, like sheets of paper laying on top of each other, sliding around to reveal different content sections.

Google designer Matías Duarte explained that “unlike real paper, our digital material can expand and reform intelligently. Material has physical surfaces and edges. Seams and shadows provide meaning about what you can touch.”

This is why we’re seeing design start to move away from flat design, sliding back to a more skeumorphic experience. But don’t worry, it will never get as far as the uber glossy buttons of yore and offensively strong drop shadows. What it does mean is that designers are starting to incorporate more subtle shadows and gradients back into their traditionally flat designs for added depth. For instance, that flat blue button, laying flat on a stark white background, will now have a subtle drop shadow so it appears to be a “physical” component sitting atop the ‘background material” but it will be so subtle, you probably won’t notice it unless you look close enough.

When Google creates something this big of a deal, other designers, myself included, take notice and pick up on a thing or two that in turn influences their designs going forward. I’ve been an apple fan forever, but watching what Google has been up to the past couple years is starting to make me think, maybe,  just maybe, one day I’ll slide to the dark side and go Android.

5 Top Sources for Free Stock Photos

Stock photography, when used properly, can be a real visual asset to your site. However, there is a lot of garbage to sift through to get to the good stuff and the process can be down right tedious and expensive. If you have a website or blog, there is a solid chance Professional photographer takes posed photoyou’ve run into the problem of finding quality images at an affordable price.

The major problem with stock houses is that their overly posed, stiff images tend to be severely dated, but yet they still want you to pay a premium for them. That doesn’t always seem like a good deal to me, so when I have time—and a small budget—as a designer, I tend to look at these top five free stock photography sites first.

1. Wikimedia Commons

All of the images on this site are uploaded with Creative Commons licensing, and are owned by the individual users, not Wikimedia. Creative Commons licensing basically means the photographer is graciously letting you use their image for free, but be sure to read the terms, sometimes there are conditions.

2. Compfight

This site is great because it allows you to filter Flickr images though Creative Commons, making the process much easier. The images are all uploaded by real users, and therefore appear much less stocky.

3. Stock.xchng

This is a more traditional stock house, just without stock house pricing.

4. morgueFile –  The word “morgue” is taken from the name of the room from the publishing world in which all clippings and image files were kept. Probably not what most people think of when they hear “morgue.”

5. Wylio

This site was set up with the blogger in mind. They make it easy to search, resize, download and imbed images into your blog all at once. 5 free images per month, with reasonably priced upgrades. You just have to grant access to your Google picasa web album.

Bonus! 6. Unsplash

This is technically a Tumblr page, not a searchable stock site. It’s full of beautiful, artistic, completely free, do whatever you want to them, images created by the people at ooomf. If you subscribe to their page, they’ll send ten new images to your inbox every ten days. And who doesn’t want eye candy sent to their inbox?

Knowing when you can and cannot legally use an image can be challenging, so make sure you read—and follow— the licensing info that accompanies the image. You don’t always have to “get what you paid for,” you just have to know where to look.

What’s your favorite free or low-cost resource for stock imagery?