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.
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?
Earlier this year a German court ruled that Amazon’s ‘dash’ buttons violated that country’s consumer protection laws. These super convenient networked devices stick on your fridge or washing machine to order things like laundry detergent and pet food with the simple push of a button. German law requires shoppers to have price information at the time of their transaction. Amazon’s buttons, designed to be convenient, only provided a product logo and a button so users wouldn’t know if a price had increased, decreased or how it differed from competitors.
At Sandstorm, our core eCommerce UX principles include:
- Transparency in pricing
- Giving users the ability to quickly and clearly modify or cancel an order
- Providing ways to quickly decline cross-sells and up-sells
While users have come to expect a standard ‘exit through the gift shop’ process, they are also savvy enough to know that eCommerce sites like Amazon and Expedia may not be showing them the cheapest options first.
Our user research has shown that the current eCommerce shopper is one who will prioritize convenience as much as cost. We refer to this persona as the ‘Energy Manager’. She has little time, is often multi-tasking, desperately craves convenience, and expects competitive pricing. From a saving money standpoint, the Energy Manager will apply all of the coupons and promotional codes she can find and will split orders to use more coupons.
She is also very wary of sites that engage in deceptive practices or make her jump through hoops to complete a transaction. Often these are the sites that do not get return visits.
There Is A Cost For Bad Behavior
While you may be able to frustrate users with complicated interfaces or processes to try and get them to do what you want, ultimately the only thing you’ll achieve is user frustration and brand denigration. Even worse, you’ll probably just earn yourself more customer service calls and brand-eroding, sometimes viral, dreadful complaints across social media channels without achieving the business outcome you desired.
But We Really Want To Sell You That Beer
For example, a Chicago neighborhood movie theater uses its own non-responsive website to sell tickets. The theater uses a drop down for the type of ticket the user would like to purchase.
While lots of folks enjoy a good beer with their movie, it’s apparent that not everyone does because the theater added a note to try and prevent users from making the wrong selection.
So here you have a situation where the theater is defaulting a choice that will make them more money by upselling a beer but have clearly run into the issue of users making the default selection by mistake and then complaining. The resolution to these complaints? Add more copy (i.e. noise) to try and avoid the error.
A transparent, ethical, best practice eCommerce UX solution would be:
This way the user has to intentionally make the selection that applies to them with the most common selection listed first. The business still gets to offer the beer upsell but doesn’t have to deal with as many complaints and no copy is required to work around the error case.
Being Good Pays Off
Users understand that eCommerce sites are businesses and are intended to make money. At Sandstorm, we have discovered that when a businesses’ profit model is clear, it tends to engender more confidence from the user as the best digital experiences are centered around a value exchange (i.e. “I give you my email and you give me a deal”). eCommerce sites that follow UX best practices provide clear pricing information along with relevant up-sells and cross-sells and easy ways for the users to get what they want quickly and easily are the ones who will earn their users’ loyalty. Good UX and good eCommerce will pay off in smoother transactions, less customer support and more repeat business.
Does your eCommerce site provide the pricing transparency and easy shopping experience that users want and good business demands? A great way to find out is with a standardized heuristic evaluation that grades your site on 10 common usability metrics. Contact us to get started.
Since 2005, the Drupal community has gathered at DrupalCon to learn, explore and share. Embracing our “Be Curious” core value, Sandstormers headed for Seattle, WA to the 2019 DrupalCon conference, in order to glean new insights, stay on the pulse of the Drupal roadmap, and uncover better ways to leverage Drupal, all while experiencing the beautiful Pacific Northwest.
Here’s what you need to know from this year’s conference.
1. Don’t wait for Drupal 9. If you’re on Drupal 7, start planning your migration to Drupal 8 now.
Drupal 7 will no longer be community supported as of November 2021. Powerful new features are being released for Drupal 8 every six months, and the path from Drupal 8 to 9 is being engineered to be easy. Moving to Drupal 8 now is the smarter business decision and better investment for most websites.
Why upgrade now instead of later?
Migrating sooner will significantly reduce the delta of the platform, module and architectural changes that need to be addressed. The migration from Drupal 7 to Drupal 8/9 is a significant shift, there’s no getting around that. By upgrading now, you’ll be able to address these changes now, which should put you on a much simpler, less costly upgrade path, once Drupal 9 is released.
In addition, by moving to Drupal 8 now, your ongoing investment in the platform will sustain as you upgrade to Drupal 9. Short-term investments in Drupal 7 (custom development, modules, features, etc.) may need to be re-written once you’re ready to upgrade.
2. Your website speed directly impacts your revenue.
Speed matters- that’s not new. But the disparity between fast sites and slow sites continues to grow. It’s simple: the slower the site, the less revenue you’ll generate. If your site loads in less than 5 seconds, you’re generating about 2x more revenue than if your site was slower.*
…And if that isn’t convincing, consider Amazon, who loses 1% of sales for every 100 milliseconds of increased response time.
3. Seriously consider adding GraphQL to your Drupal environment.
GraphQL (www.graphql.org) is a querying language for APIs and acts as a common language between services and applications. GraphQL was created originally by Facebook as a data-fetching API, so it needed to be powerful, yet easy for product developers to use. Today it powers hundreds of billions of API calls per day.
Why does it make sense?
GraphQL is a powerful choice for businesses who have many disparate services and offerings that need to communicate as it serves as a common language between them. Think of it as the glue that binds the business’ functions together. For example, with GraphQL, the sales app can ask the inventory app if an item is in stock and if either app gets rewritten or modified the communication between the two will not break.
In addition to the simplification of service-service communication, apps using GraphQL can be quick even on slow mobile network connections. While typical REST APIs require loading from multiple URLs, GraphQL APIs get all the data your app needs in a single request.
"I think GraphQL wins my heart because it changes human behavior" - Garrett Heinlen, Netflix
In addition to Netflix and Facebook, companies like Shopify, Walmart, Yelp and the New York Times have embraced GraphQL.
4. Advanced Automated Visual Testing will be a massive step for QA.
Humans can’t detect the most subtle changes in a site but Advanced Automated Visual Testing can. With an automated system for finding discrepancies, we can expect shorter soft release cycles and a larger device operating matrix – making the job easier for QA. This also equates to reduced costs and time savings in identifying those sticky, small bugs.
There are many tools available to enable automated testing in the development cycle, such as WebdriverIO (https://webdriver.io/).
By leveraging the power of automated testing, QA can focus on meaningful work instead of “spot the difference” games.
5. Improving accessibility can produce a clear ROI.
Many companies think about accessibility as it relates to legal compliance. That's a valid concern, but improving your accessibility also presents a huge business opportunity. Improving accessibility can mean increasing the reach of your site by up to 20%.**
Beyond making your content more available to more users, your efforts will likely also drive more traffic through the natural SEO benefits of having well-structured content.
Improving the accessibility of your site is a lifestyle, not a one-time event. Contact us to schedule your Drupal Accessibility Audit.
Concerns with Drupal 7’s end of life for your existing Drupal site? Need a place to start?
Contact us to schedule your Drupal 8 Readiness Assessment to see if moving from Drupal 7 to 8 is right for you!
For more DrupalCon details, check out the State of Drupal presentation: https://dri.es/state-of-drupal-presentation-april-2019
*Joe Shindelar. “Gatsby & Drupal”, DrupalCon Seattle 2019
**Aimee Degnan, Caroline Boyden. “Accessibility Deep Dive”, DrupalCon Seattle 2019
The National Business Institute is a professional association providing continuing legal education (CLE) for attorneys and paralegals for over 35 years and delivering over 18,000 in-person and on-demand resources.
While NBI’s live seminars and OnDemand resources lead the industry, their website and subscriber experience were trailing behind. NBI partnered with Sandstorm—to create a personalized, user-centric (and most importantly, revenue-driving) experience for existing subscribers, transactional customers, and prospects.
Sandstorm began with user research that identified the motivations and expectations of each type of customer. Then, we crafted a myriad of user flows based on user groups, extensive site map, navigation, wireframes and creative to align each step in the purchase process with those expectations.
By conducting usability testing, we uncovered user needs, expectations, and insights, including:
- The use of key statistical information vs. the use of customer testimonials on the homepage was much more impactful to key audiences.
- Including specialty credit details in the search results, since this is a key identifier in the selection of a course and purchase process for users.
- Users wanted stronger use of colors throughout the experience, but still honoring the blue that NBI was well-known for.
Because findability and conversion were primary goals, we needed to determine how to best integrate a robust search throughout the experience. The final site includes multiple layers of search exposed within the experience to ensure users can quickly and easily find desired courses and find them in the format they wish to consume them.
Personalization was also key. Sandstorm worked closely with NBI’s development team to build in targeted courses based on a users’ geolocation and schedule (recommended courses, happening soon, and best sellers).
As NBI was shifting its business model to more emphasis on a subscription model vs. one-off courses, the conversion path to becoming a subscriber needed to be clear and slightly varied experience from an individual visiting the site for the first time.
And, knowing the mobile experience was critical to these users, we crafted and deployed a fully responsive designed experience, including personalization based on returning users vs. new users to the site.
Finally, we extended the user experience and creative via front-end development and collaborated closely with NBI’s in-house development team to ensure the experience seamlessly integrated with NBI’s back-end CMS, technology and complex e-commerce systems.
The Hermes Creative Awards honored the National Business Institute and Sandstorm with a Gold award for the agency’s redesign of the NBI website.
The 2019 award winners were announced by the Association of Marketing and Communication Professionals (AMCP), which administers the annual Hermes Creative Awards international competition.
In addition, the website has experienced significant improvement, including:
- Organic SEO positioning has increased by 20%
- Conversion rates are up 12% year over year
- Experienced higher search and filtering traffic that converts at a much higher rate than the prior site experience
- Received extremely positive feedback from its subscription-based customers via the streamlined and much-improved checkout flow
“Thank you for your help. The site looks great and we couldn’t be happier with what you did for us.”
Jim Embke - Managing Director, National Business Institute
The Society of Actuaries (SOA) is the pre-eminent association for the actuarial profession. With over 30,000 actuaries as members, the SOA’s mission is to advance actuarial knowledge and the ability of actuaries to provide expert advice and solutions for financial, business and societal challenges.
In line with their mission, the SOA wanted to take the conceptual idea of an Actuarial Toolkit and bring that to life in Drupal 8 as a web application. The SOA's existing Glossary App needed to be redeveloped into a web app, in addition to incorporating data from multiple websites.
The SOA kickstarted the project internally with some baseline requirements and initial design mock-ups to support the reimagined Actuarial Toolkit. Sandstorm was able to quickly collaborate with the SOA and build upon the work completed, in order to begin transitioning into more detailed user experience and technical requirements.
The SOA partnered with Sandstorm in order to build an interactive web application that delivered a variety of online resources for actuarial candidates, actuaries, and actuarial analysts. We identified with the SOA that Drupal 8 would be the optimal platform that would offer a high level of flexibility and a scalable development framework to support the desired interactions along with a robust mobile experience.
With a Drupal-based solution and our proposed technical architecture, we were able to provide a scalable framework for the SOA to expand and grow to support the other SOA applications. The goal was to make it simple for the SOA to build out new solutions over time, without significant investment each time. The architecture also supports opportunities to transition to a headless Drupal solution (if desired in the future), which could be used to drive native mobile apps.
In addition, the Actuarial Toolkit supports the longer-term vision and consolidation of its online tools to support the Actuarial Profession.
The Actuarial Toolkit includes the following features:
- Interactive Actuarial Glossary including over 500 peer-reviewed definitions, concepts and practice area terminology for those working with Actuarial Science
- Bookmarking to save favorite pages in the toolkit
- Flashcard function to display glossary terms saved for quick access and review
- Main hub for practice areas, giving users access to pre-defined mathematical definitions and data templates used in the profession including curated live illustrations of actuarial and mathematical concepts using R
- Integrated Single Sign-On experience with the SOA’s Association Management Software system and website so users can move seamlessly through the entire web experience
The SOA launched the new Actuarial Toolkit after working for many months curating the content and finalizing the industry definitions and terminology to ensure a highly usable, high-touch, personalized experience. Overall feedback has been incredibly positive from the SOA membership and community, not only offering an interactive suite of tools to advance learning in the profession but also giving the users even more personalized experiences that they can control.
We do a lot of branding and rebranding for clients here at Sandstorm. Naming is a fundamental piece of any organization’s identity, and we do not embark on this process lightly. It requires clients to do a lot of reflection about where they are today and where they want to be 5, 10, 20 years from now.
In order to ensure the company name resonates with clients, customers or members, we conduct thorough discovery to unearth who the organization is at its core. The research does not end there; we then look at competitors and like-minded organizations outside of our client’s industry to see where the opportunity, or “white space,” is. It is fundamental that a company name honestly represents the organization. It also needs to differentiate itself, but not stray too far from the core identity.
Here are tips for success when embarking on the business renaming process:
Tip #1: Easy to Say and Spell
Make sure the name is easy to say and spell. In the age of Google, you want to make sure that you are easily found when someone is searching for you. The name also needs to be easy for someone to spell while they are talking on the phone or writing out an email address.
Tip #2: URL Availability
Don’t forget to make sure there is an appropriate .com URL available that has some iteration of your name. You may have a great company name, but if there is no intuitive URL available, or if it’s ridiculously expensive to secure, then you are going to make things very difficult from a digital marketing perspective.
Tip #3: Rename for a Good Reason
If you are renaming, be absolutely sure you have solid reasons for doing so.
- Has there been any bad press about your organization with the current name?
- Have you moved your organization in a direction that no longer aligns with your name?
- Do you offer different things then you did when you initially named your organization?
- Will a new company name help better articulate the new offerings?
Do not rename just because you acquired another organization unless this acquisition redefines how you’re positioned in the marketplace. You should not choose a new company name because you are launching a new product, either. That is, unless the product will fundamentally redefine your target and competitive arena.
Tip #4: Your Name Must Mean Something
Your new company name should reflect your organizational values and purpose. Don’t go chasing shiny objects, buzzwords or “the zeitgeist” and hope that the organization will follow. You will be setting up an expectation that will be hard to meet if your name, mission, and people do not fundamentally align. Get your organization aligned for this change before trying to rename. Once your team is all on board, that’s the perfect time to announce your newly minted organization to the world.
Tip #5: Can the name cover your long-term goals?
Your company name needs to have longevity. What you call your company today needs to be big enough to account for changes and growth for years in the future. Renaming a company is time-consuming and is a considerable investment in your organization's future. The name itself seems small, but what it represents is immense. Naming and renaming should be approached thoughtfully, in order to garner the most ROI from the change.
Naming and renaming are fun projects. There is so much potential in a new name. Follow these five tips and you will be well on your way to a solid name.
[If you need some help with renaming, contact us, and we can put these considerations into action with you.]
We mold user research to drive extraordinary creative results through the development of a "persona." A user persona (also called a UX persona) is a fictional character created to represent a particular market segment. This character is given a name, picture, biography, and personality. Sandstorm uses personas in the same way that an actor looks at a role. Before deciding on a creative direction for the UX design concepts, questions are posed related to a specific persona's motivation, needs, and biases to guarantee the usability of a particular website or application.
Personas provide a noticeable advantage by creating a face to represent an entire group, and can be an ideal to way gather content and functional requirements, and prioritize features. It can be difficult considering a whole audience's point of view, but from the perspective of a persona (or a face to represent an entire group), it makes the audience seem more real.
Our UX and creative team ask the question "What would Rita do?" instead of "What would a pediatrician, 37–58 years old, with a private practice, 15+ years experience, living on the West coast, do?" Personas result in a user experience designed for the user.
Our methodology for developing user personas:
- Identify initial audiences and possible scenarios
- Write protocol for the research (may include in-depth user research, surveys, card sorting, participatory design, etc.)
- Schedule participants, mock the study with the moderator and note taker
- Conduct research to gather insights to validate initial beliefs or discover new audiences and scenarios
- Analyze results, build personas and list of scenarios
- Use personas as references for recruiting participants for usability testing
- Design the UX from the user personas, scenarios, and usability research results
To see how UX persona development differs from traditional demographics, request a proposal on user persona development today.
As part of our annual review process we use the start, stop, continue retrospective technique. We've found it's a great way to recognize successes and opportunities for growth for individuals, teams and organizations. Thinking about the digital transformations we've seen with associations lately, below are some retrospectives on what we see trending with membership organizations.
Creating a culture of data. Using data to inform your decisions and weaving that into everything you do is critical to success. We are working with an association today where we're collecting and analyzing data to identify educational gaps and drive new products (and revenue). We're also utilizing data to drive content and functional requirements on new website builds to improve the member experience. By taking a fresh look at member data for a global membership organization, we were able to re-interpret the data and create new marketing campaign messaging to increase membership and product sales. The combination of qualitative and quantitative data helps associations turn subjective decisions into objective ones. Even when we're talking creative and UX – data science for us plays a huge role.
Stop building websites in proprietary technologies on a web dev shop's server as you are trapping yourself and it’s completely unnecessary now. Many leading associations are utilizing off-the-shelf content managements systems like Drupal, Kentico, etc. to integrate with their AMS and LMS systems, provide personalized member experiences, and track analytics and KPIs. Then you have options when it comes to supporting your chosen system. You can choose to have the original digital agency maintain and support your site, you can select a new partner for support, or bring it in house. We also recommend you own the hosting relationship with a 3rd party provider such as Rackspace, Azure, or AWS so you are never "stuck". We have taken over the maintenance and support for so many association websites that didn't get the service, attention to detail, nor strategic thinking to drive their association forward, and it was all possible because of the CMS they selected (and it's always a smoother transition when a 3rd party hosting provider is involved but not necessary).
Continue focusing on member engagement, member value and the overall member experience. This is what we love most about associations. It doesn't matter if you're a trade association or medical, large or niche, everyone shares a common mission to help your members become more than they can on their own. One of the most common challenges and motivations we've seen for launching into a new website overhaul was to improve their members' online experience and increase online member engagement. And we get it – we, too, are all about the user. When you look into the member journey, continue at all touchpoints to remember we're all just people trying to be the best version of ourselves. Keep the humanity alive in your organization that you have already mastered.
How well do you know your customers? How much insight do you have into your user's experience with your product, web site or mobile application? We've conducted over 3400+ hours of user research interviews and usability studies, and there's always a learning moment.
Our user experience research includes web site surveys, web analytics reviews, and in-depth interviews with your customers and potential users to uncover common goals, needs and wants, and how your customers use your application or website. Our one-on-one conversations uncover a common set of tasks performed on your website — all enriching the user experience design.
Why conduct user experience research? User research provides us with tangible insight into how people interact with your brand (i.e. the user experience). Discover how your users absorb information, how they expect to use your product or web site, and what motivates them to use you over the competition. The information we collect will help you understand the behavior of your users and drive the development of the information architecture and wireframes.
How long will it take? Studies can be as short as 2-3 weeks, or as long as 3-4 months depending on the number of user groups, organizational goals, recruiting factors, and budget.
Your end result? A comprehensive report to walk you through the research process, including: interview outlines, noteworthy comments, user opinions, and content/functional requirements. We can take the research even further and break down our recommendations by user group, and give each user group a name, face and personality through the development of a "persona."
Want to learn how to quickly gain insight to enhance your user experience? Request a proposal today.
Dr. Karen Bartuch, Sandstorm's Director of Data Science, presented 10 practical innovation tips at the Association Forum Holiday Showcase.
For most organizations, innovation is table stakes for long-term growth and a competitive advantage. Yet, according to McKinsey, 94% of managers surveyed were dissatisfied with their organization's innovation performance. So why are some organizations better at it than others? Google employees are encouraged to spend 20% of their time, in addition to their regular projects, to work on what they think will most benefit Google. Both AdSense and Google News were created this way. But I know what you're thinking, we're not Google.
Innovation is a deliberate choice, and in most organizations, it doesn't accidentally happen as your people need permission to explore and create. And everybody has the capacity to create according to the Componential Theory of Creativity, "..all humans with normal capacities are able to produce at least moderately creative work in some domain, some of the time—and that the social environment (the work environment) can influence both the level and the frequency of creative behavior."
Below are 10 practical tips to unlock your inner innovator and incorporate it into your daily life:
- Don't worry about critiques
- Forget the need to be 100% original
- Go from specific to abstract
- Be aware of shortcuts and biases
- Practice diversity
- Get hands on
- Spend a day in the life
- Carry a sketchbook
- Work during your “peak time”
- Inject humor into the workplace (check out Karen's TEDx Talk)
During this session, attendees got the opportunity to synthesize what research is telling us about the need and desire for innovation, and understand key strategies to infuse creativity and innovation in your organization. Contact us if you want to discuss any upcoming innovation initiatives you'd like help with.