James Wynne is Director of User Experience for Sandstorm and has been in digital product development since 1996. He has worked as a UX designer for a myriad of clients including large eCommerce brands, mobile device manufacturers and integrated marketing agencies.
Over the past several years, DCLI has transformed itself and the intermodal transportation industry. As the largest provider of chassis in the U.S., they’re renowned for their industry-leading technology and logistics expertise.
But DCLI’s web and marketing presence was hindering the company’s growth. That’s why they turned to Sandstorm®.
Engaging Tool Increases Revenue
DCLI first asked us to help them solve an interesting challenge: reduce the burden of high sales-call volume while increasing revenue among potential clients. We jumped at the opportunity.
Through intense collaboration, we were able to develop an automated quote tool that seamlessly integrated into DCLI’s website. The result? Within the first month of its launch, the quote tool generated 49% of all marketing-influenced revenue.
Confident in our ability to deliver proven results, DCLI shifted their focus to two even more ambitious initiatives:
- Creating marketing campaigns where none had previously existed
- Designing and developing a new website to showcase their revamped brand
Building Creative Campaigns From the Ground Up
DCLI came to us with aggressive marketing goals. To help them achieve their objectives, we held a marketing workshop with key members of the company. This allowed us to gain insights into their business, and collaborate on a value proposition and strategy statement that positioned DCLI as the most agile intermodal partner around.
Building on this strategic foundation, we created ad concepts, event collateral, infographic, and sell sheets that drove the DCLI brand forward. Most important for DCLI, we implemented tracking within creative so they can begin measuring return on ad spend.
But our most ambitious collaboration was completely redesigning and developing DCLI’s website.
Reimagining DCLI’s Digital Presence
Creating DCLI’s new website engaged nearly every aspect of our expertise. Our unique approach benefitted DCLI in several ways.
Better Targeting of Customer Verticals
DCLI needed their website to talk to five separate user groups—motor carriers, ocean carriers, non-vessel-owning common carriers, beneficial cargo owners, and domestic shippers. We designed every aspect of the new website with these users in mind, making it easy for them to self-identify and find the tools and information that matter most to them. We even traveled to one of the nation’s largest terminals so we could showcase the breadth and depth of DCLI’s expansive chassis fleet to potential customers.
Content Optimized for Search Engines
To enable DCLI to capture as much organic traffic as possible, we analyzed current traffic and performed competitive keyword analysis. This allowed us to optimize all content across the new website, which resulted in a 27% increase in organic traffic in the first two months of the launch.
Integrating Marketing Automation
To capture leads at key touch points, we needed to successfully integrate the Pardot CRM platform. That required setting up tracking codes, incorporating the Pardot plugin within the CMS, and styling a custom form template within the CRM. The solutions were a huge success for DCLI, and in the first day of launch, the integration resulted in 7 leads.
In the wake of the successful launch, we’re continuing to test and optimize, and collaborate with DCLI to identify new opportunities across sales and marketing that elevate their brand.
We’re thrilled to help DCLI spotlight all of the innovative ways they help their customers keep cargo moving. See the new DCLI website for yourself!
Jelmar is most recognized for its broad range of cleaning products (CLR and Tarn-X) that have helped solve some of the toughest household cleaning problems... maybe you've seen their commercials to clean your showerhead?
The CLR Brands website was outdated and virtually unusable on a mobile device. There was also a great deal of confusion across the brands – parent company, Jelmar vs its flagship products (CLR and Tarn-X) and related products. The site did not provide a cohesive experience, nor was it intuitive for consumers visiting the site for more information or where to buy CLR or Tarn-X products. It also did not properly serve the needs of its distributors and retailers. Given the brand structure and Jelmar’s drastically different audiences, it was critical to have a modernized user experience that was cohesive while providing variations based on the two distinct user groups. Sandstorm was challenged with reinvigorating and personalizing the CLR brand experience integrating social, digital, marketing automation and the website; as well as utilizing technology to drive better business decisions – which is why the Kentico EMS content management system was ultimately selected.
Based on our in-depth user research, one of the primary goals for consumers was to identify where they could buy CLR products. Sandstorm completely overhauled the “Where to Buy” feature (formerly the Retailer Locator feature, which we renamed based on our usability study results). This tool incorporates a custom Product Search, including radius map in several key areas of the site to improve overall usability – check out the Where to Buy feature here. On the administrative side, Sandstorm developed a product management tool within Kentico, so Jelmar staff can easily manage updates to products in a single location, which propagates throughout the site. In addition, Sandstorm implemented Kentico’s Smart Search to drastically improve the findability of products, "How To" videos, FAQ spec sheets, blogs and news, etc.
Behind the scenes, Sandstorm utilized Kentico’s Staging and Synchronization features to manage development and testing in one environment, user acceptance and content editing in a second environment, and live production in a third, while ensuring that integration of code and content between the sites can always be easily managed and synchronized. From a content migration perspective, Sandstorm utilized Kentico’s import utility and custom scripts to map content into the new site, product details, images and related taxonomy. Sandstorm also leveraged Kentico’s features for tagging, categorization, Google sitemap generation, and other capabilities to improve SEO of the site.
The entire project included a complete redesign, in-depth user research, information architecture, usability testing, UX/UI development, Kentico install/configuration, Kentico web development, content migration, QA testing, analytics and launch. Additionally, upon launch, Sandstorm ran multiple email campaigns using Kentico’s Contact Management and Email Marketing features to deliver messages segmented for audiences interested in retail products separately from products for industrial/commercial uses.
End results? 380% increase in use with a 78% increase in site entrances directly to the new "Where to Buy" versus the previous "Retailer Locator". Overall 12% increase of pageviews, and an 11% reduction in bounce rate – within the first 30 days. Visit clrbrands.com.
At Sandstorm®, we take security seriously. For the not-for-profit National Insurance Crime Bureau (NICB), that means preventing insurance fraud and theft across the United States. NICB turned to Sandstorm to design and develop a brand-new website that could better help them advance their mission.
The launch of this site represents a significant shift for NICB. The previous website addressed two audiences: the general public and current members. By focusing on non-member audiences, NICB can more clearly convey their message and raise awareness with common consumers.
With an iterative, user-centered approach that utilized usability testing to refine navigation items and page layouts, we designed an intuitive user experience that we developed in Drupal 8. By building in the newest version of Drupal’s content management system, we were able to give NICB a robust e-commerce platform with an intuitive administrative interface.
We are honored to help NICB raise awareness of their mission and help combat insurance fraud and theft. Check out the new NICB website for yourself.
With a five-year growth rate of 120% and 2016 revenue exceeding $5 million, Sandstorm® once again made the list of the Top 100 Fastest Growing Inner City Companies in America recognized by Fortune and the Initiative for a Competitive Inner City (ICIC).
ICIC’s Inner City 100 list seeks to celebrate and enable urban entrepreneurship. Over the course of nearly 20 years, ICIC has awarded 928 companies whose success illuminates the innovation and business growth happening in our inner cities.
The list of 2017 Inner City 100 companies was revealed at the 19th Annual Awards and Conference in Boston. Sandstorm rocketed up the list more than 30 places from 2016, coming in hot at #66. The full list can be viewed on the Fortune website.
“We are extraordinarily proud of these pioneering entrepreneurs who lead the way in innovation, job creation and the economic revitalization of America’s inner cities,” said Steve Grossman, CEO of ICIC. “In addition to excellence in business, they have also demonstrated a deep commitment to and passion for their communities, which plays a huge role in the wellbeing of their local economies,” he said.
At Sandstorm, we couldn’t be more honored and excited to be among these amazing winners, and we can’t wait for 2018.
Recently I had the honor of speaking at .orgCommunity’s Solutions Day 2017. Usability testing is a big part of how Sandstorm eliminates subjectivity from the creative process, so I wanted to show attendees how usability testing can help drive significantly improved user experiences.
With as few as 5–6 users, usability testing can identify 80% of user issues on a website or mobile app. Our Sandstormers have learned many lessons while performing more than 3,000 usability studies. These are just a few of the findings that can help you.
1. Members want to see real images of their peers.
We performed usability testing for the American Planning Association as part of a redesign of their website. During testing, we learned that their members found the stock photography used on their existing site inauthentic and unengaging.
This simple finding led us to use professional photos of real APA members that improved engagement on key pages, including the homepage, Events page, and About Us page.
2. Don’t put too many events on the homepage.
The Association for Corporate Growth (ACG) holds 1,200 events for 58 chapters across the globe each year, and they were struggling to find a way to highlight events.
Before we tested, ACG was including 25 events on their homepage, which was harming the user experience.
We needed to make it easy for members to find the events that were of interest, in their location, etc. So we created a featured event section on the homepage that links to an events page allowing users to filter by keyword, chapter, date, and event type.
3. Navigation items that require user action need an active verb in the title.
We made a surprising discovery while testing wireframe designs for a large non-profit organization: users thought the navigation items were too unclear and passive.
By adding active verbs to these items—for example, changing “Theft & Fraud Awareness” to “Prevent Theft and Fraud”—we were able to make the navigation clearer to users and let them know what they would be able to accomplish when visiting the page.
4. People miss content when there’s no visual cue.
Weber was redesigning the website for their grills and accessories and wanted to test several UX changes on a development environment before going live.
One of the issues we uncovered was that users didn’t know that the navigation items in the main menu expanded.
To solve this, we added carets next to the menu titles to indicate action. After making this simple fix, users clearly understood that they would find additional pages in the menu.
5. Using a search icon without an input field confuses users.
While redesigning the website for NOW Foods, we found that users were confused by a small change: we removed the input field for the search bar.
By merely adding the field back to the search area, users could search the site with ease.
Usability testing is a quick, simple way to improve the user experience, whether you’re creating a new site or app or redesigning what you have now. Contact us to learn more about how to execute your own usability test today.
Should you use a hamburger menu for your mobile navigation?
That’s a matter of ongoing debate here at Sandstorm®. It’s a debate we carry out in email chains linking to the latest articles, with subject lines like, “Hamburger menus were (bad/good).”
So I’m here to finally end the debate and offer a definitive answer on whether you should use hamburger menus by saying, “It depends.”
Because that’s the truth: Hamburger menus aren’t uniformly bad or good. It all depends on your audience, your goals, and how best to structure your information so that it serves your users and your needs.
The Myth of the Hidden Menu
In his article Why and How to Avoid Hamburger Menus, Louie Abreu lays out a thoughtful argument against the pattern of using sidebar menus. For him, the biggest issues are:
- Low Discoverability—the menu is out of sight and, therefore, out of mind.
- Reduced Efficiency—it creates navigation friction for the user.
- Navigation Clashing—it clutters up and overloads the navigation bar.
- Lack of Glanceability—information about specific items is harder to surface.
But I don’t quite buy the rest of his argument.
Since 2014, when the article was published, hamburger menus have become a common pattern for some of the most highly trafficked sites on the web, including Google and Facebook. And in countless usability studies, we’ve seen that most people don’t mind the ‘hidden’ menu on mobile devices.
The main issue we’ve seen in usability studies is some users don’t understand the three-horizontal-lines ‘hamburger’ icon. This is consistent with an A/B testing experiment conducted by Sites for Profit, which suggests that the three-horizontal-lines ‘hamburger’ icon is less effective than the ‘menu’ label. So there is definitely evidence that supports adding a menu label underneath the icon or simply using the word ‘menu’ instead of the icon.
What users really want is something that’s designed for them, whether it includes a hamburger menu or not—and I’d argue that most users don’t know that this is even a debate.
So how do you effectively use a hamburger menu without alienating users?
Considerations Before Using Hamburger Menus
1. If your navigation structure is small and simple, why not just show it?
Websites with a deep menu structure—like large enterprise software companies—can benefit from hamburger menus. But small websites, like those for a local business, have limited functionality and can display their full navigation. Or you could use one of these emerging patterns for mobile navigation.
2. Label your menu with the word menu.
Our own tests and others have shown that just adding the word ‘menu’ below the hamburger icon increases user engagement. Or ditch the icon and just use the ‘menu’ label.
3. If you have the screen width to display your menu, you should do it.
Avoid hiding your navigation on larger screens. If you don’t have to use a hamburger menu on tablet, then don’t.
4. Nesting can be a problem, if your menu structure is too deep, there’s probably something wrong with your architecture.
The hamburger/offscreen navigation pattern can get tricky if your menu structure is deep and wide. It’s probably not a good pattern to use if this is the case, but the first thing you should do is consider revising your site architecture so it’s less complex.
If you need help with your mobile navigation, Sandstorm can help. From usability testing to user experience design, we’ll help you find the solution that works best for your users.
In 2017, people are more engaged with video than ever before. Content might be king, but video is the king’s hand.
Visual Content Is Up
You want someone to read your tweets? Include a visual.
Across the board, posts that have images or video just perform better. It’s why Twitter and Facebook not only let you add an image, they often auto populate the main image from your shared article into the post.
And users can’t get enough. According to Hubspot, 43% of users want more video, and marketers say it has the best ROI.
Businesses Are Catching On
According to Vidyard, 85% of businesses have staff and resources for producing video. And those videos serve a wide range of industries and purposes. Technology and manufacturing companies produce the most videos, which makes sense considering that most videos are demos, tutorials, and testimonials.
At Sandstorm®, our creative team has experience in video creation, and we’ve created video for several of our clients.
Keep It Short and Sweet
Attention spans aren’t getting any longer—at least according to a study from Microsoft that says our attention spans are shorter than a goldfish—so there’s no need to make lengthy videos. Most videos should be less than 3 minutes—with the exception of product demos, which can be longer. Nobody’s cozying up with popcorn to watch your video; they want to see it and move on to the next.
Could a video be right for your company? It all depends on your brand and your audience, but video can be a simple way to easily and quickly introduce your company, products, services, or even highlight your culture. Let us help you tell your brand story through video.
Stronger member engagement. Increased traffic. Connecting with Millennials.
If I just listed everything on your association’s wish list, then gamification has a lot to offer you.
Gamification is all about motivation. It plays on people’s competitive nature and love of recognition to encourage them to accomplish goals. And gamification works wonders. Studies show that gamification can lead to a 150% boost in engagement, which is why more than 70% of the Global 2000 according to badgeville.com have at least one gamified app.
How can you start taking advantage of gamification’s benefits? We’ve created a quick walkthrough to help you power up member engagement.
1. Add a profile progress bar.
Users want goals and they want to feel like they’ve accomplished something. More than 75% responded to a survey saying that they want an indication of progress.
LinkedIn has mastered this technique to get members to build out their profiles: rewards for completing a profile, clues that offer direction, and tapping into users’ competitive nature to see who is looking at their profile.
2. Include provocative language in the profile form.
Asana challenged its users by asking them to describe themselves in seven words. When they made that switch, their response rate increased 98%. With just a simple form change, you can get your members to be more engaged right from the start.
3. Use points to incentivize members to come back.
Learning a new language can seem daunting, unless you use Duolingo. The popular language education app grew to 110 million users in just three years, and it keeps those members coming back by giving them experience points for each completed task.
4. Award badges for participation.
It can be difficult to get off the couch, but Fitbit encourages users to push harder by awarding badges for milestones. And the awards aren’t just for running a marathon, they start with tasks that the user can actually achieve and build from there.
At Sandstorm®, we can design new and exciting ways to engage your members through gamification.
Watch the video below for more ideas, or contact us to talk about what we can do for you.
If your website was a physical location, would you build it without access for people with disabilities?
Of course not. You’re not a heartless monster.
But a surprising number of websites forget about the needs of people with disabilities. Inclusive design seeks to change that.
The principle behind inclusive design is creating products and services that everyone can use. Not only does that provide accessibility to your website for people with disabilities, it creates a better experience for all of your users.
Color contrast is a big part of inclusive design and web accessibility. As one of the most important tools in our utility belt, color choice is a big part of a designer’s work. We use it for emotive and illustrative purposes. Red, for example, can be a great color to highlight importance and urgency. Contrasting it with white type can help draw the eye, and that color combination is great for getting users to address alerts.
So what happens when a user has difficulty seeing the color red?
Well, it turns out that white text on a red background is completely invisible to people with color blindness—something we discovered during one of our usability studies. In fact, there are a number of color combinations that cause problems for the visually impaired.
Luckily, there are organizations like World Wide Web Consortium (W3C) to create standards for accessibility issues like color contrast. In fact, W3C went so far as to establish extensive Web Content Accessibility Guidelines, and the web community responded by developing tools that help designers create more inclusive sites.
Some of those tools, like WebAIM and Colorable, focus specifically on color contrast. To meet WCAG, normal, non-bolded text should have a contrast ratio of at least 4.5:1; for large text it should be at least 3:1.
What else can you do to start making sure your website is more accessible and inclusive?
1. Add Alternative Text to Images
“Alt text” is essential to web accessibility. Assistive technology, such as screen readers, relies on alt text to turn images into braille or speech for the impaired.
Most content management systems, like Drupal or Kentico, include an alt tag field for images. Start with your company logo, then add descriptive alt text for each image on your site.
2. Use the Right Heading Structure
Correctly ordering the HTML headings on each page makes it much easier for screen readers and the visually impaired to navigate your site. While design considerations might require this order to shift, try to follow it where you can. At the very least, make your page title and h1 consistent—it’ll help the people using screen readers to make sense of the content.
3. Stop Using “Click Here”
For many reasons, please stop using “click here” as link text. Not only does it make content seem outdated, “click here” is a vague and confusing link description for people who use screen readers. Instead, use strong verbs that tell users what you want them to do and what they get in return:
- Register for the event
- Request more information
- Download this report
4. Utilize Free Web Evaluation Tools
In addition to color contrast tools, enterprising developers have created lots of free tools that evaluate your website’s accessibility.
WAVE, for example, provides a breakdown of errors, alerts, and features in a list form and a visual overlay so you can identify opportunities to improve your site.
Web accessibility isn’t a cut-and-dried, check-it-off-the-list process. But when you design with all of your users in mind, you make your website a more inclusive place to be. And who doesn’t want to be a part of that?
Sometimes it feels like there are never enough hours in the day to get everything done. Until we give back.
University of Pennsylvania’s Wharton School recently conducted a study that says, “Giving your time to others can make you feel more ‘time affluent’ and less time-constrained than spending your time otherwise.”
In a rapidly moving, technology-driven, deadline-oriented work environment, it’s easy to feel time deficient. Think about it: Not only do we find ourselves heads down in our day-to-day work, we seldom make time to relish our colleagues and get to know them on a deeper, personal level outside the office.
Cue the volunteer work. Over the past 2 summers, Sandstorm® has been supporting Ravenswood Community Services (RCS) by volunteering at their pantry and distributing food to over 250 families on the north side of Chicago. But the reality is that this opportunity provides us with a much-needed pause and sense of awareness—while giving us a chance to accomplish our mission of doing good work for good people.
The same Wharton School research shows that thinking about the present moment, instead of the future, can make you feel less hurried or rushed because it slows the perceived passage of time. During our volunteer windows, not only are we focused on our tasks and ensuring that the local residents are being assisted properly, we also find ourselves in a relaxed yet spirited environment. In other words, we’re living in the moment.
Through these volunteer experiences, it’s not surprising that the time to bond and serve others has other advantages. According to the Huffington Post, volunteering through the workplace can actually boost employees’ productivity, pride, gratitude, and ethics.
So the next time you or your team get caught up in a hectic work week, live in the moment, polish your sense of purpose, and positively impact others around you by volunteering. You’ll feel like a million bucks.