Atlantic Business Technologies, Inc.

Category: User Experience

Figma’s Remote Collaboration is the Future of Design Tools
Sketch has long held the title of “industry standard” for user interface design. However, the global pandemic has shifted countless companies to work remotely, creating a slew of difficulties with online workflows and processes.

Like the Google Doc of design tools, Figma offers an antidote to online collaboration pain points. Additionally, it helps preserve a sense of togetherness and teamwork in a time where remote work is the norm.

In this increasingly online environment, Figma found a place in the Atlantic BT family. Here’s why we love it.

Figma makes online collaboration easy and fun.

1. Real-Time Interactions

Unlike Sketch, which is a Desktop app that runs on Apple computers only, Figma is a web-based app that runs on almost any operating system. You could even choose to run it as a desktop app if that’s your preference.

Anyone can quickly share a project board, prototype, or mockup with a simple Figma link. We often share a link right on slack in order to collaborate with developers, clients, and other team members.

In the past, designers would have to export drafts of a design minutes before a meeting to ensure all the latest changes are incorporated. With Figma, designers can change elements on the fly. Collaborators can drop comments and feedback anywhere on the design and receive responses from the designer in a back-and-forth chat.

2. Observation Mode

Clients and team members are able to watch the designer’s cursor as they work on projects in real-time using Figma’s “Observation Mode”. Seeing everyone’s cursors moving around the project provides a proud sense of teamwork that was often missing in early stages of the pandemic. Observation Mode has several other use cases, including:
- Design Critiques: Give a live demonstration to stakeholders and team members.
- User Testing: Observe with users as they flow through prototypes. Users will be able to use their own equipment, and we gain better insight into their experience early on in the design process.
- Presentations: When audio or visual issues become a problem in Zoom or Google Meet, Observation Mode can be a good work around to keep clients synced to a presentation. Additionally, observing in Figma can help offset the Zoom fatigue of virtual meetings and presentations.
3. Design Systems

Figma’s online collaboration also boosts productivity and cooperation between design team members by enabling design systems. Together, these design systems are stored in cloud-based libraries.

For example, Figma allows designers to create styles for fonts, colors, grids and other presets that anyone can apply to their designs. As components are designed, they are stored in a library that team members can easily search and drag into their own file.

When it comes to developer hand-off, Figma maps its components to code that developers can use when building out the application.

4. Whiteboarding With Figjam

Adding to Figma’s collaborative capabilities, they recently released a collaborative whiteboard tool called Figjam. We have quickly learned that a good whiteboard tool is a must when communicating remotely with clients and other team members.

Before the pandemic, client ideation workshops involved filling out sticky notes and writing on whiteboards. These workshops are crucial when it comes to discovering clients needs, wants, and pain points for their application or website. Online whiteboard tools provide a remote and user-friendly alternative to analog workshops and with it a few advantages.

With online whiteboard tools, it’s no longer necessary to take up wall space with sticky notes for affinity mapping and data gathering. Furthermore, the information from these sessions are saved to reference and edit later if the need arises. Tools like Figjam and Miro can be used to create personas, user journeys and flows, site maps and other deliverables all in one place.

As an extension of Figma, Figjam offers some unique capabilities that other whiteboard applications do not. Figjam allows users to copy and paste both their low-fidelity and high-fidelity designs directly from Figma. This makes it easier to create wireflows, user journeys, take notes and make annotations on the designs.

Since Figjam comes with Figma, your experience design toolset is complete. So pull out some virtual sticky notes in Figjam and rearrange them to your heart’s content!

Figma vs. Sketch Cloud

Following Figma’s lead, Sketch developed Sketch Cloud in order to share designs and prototypes among anyone with a link. While Figma was designed with online collaboration as the goal, Sketch Cloud is limited. Designers must upload their designs into the cloud before sharing them, which inhibits real-time changes and participation.

Going forward, programs like Sketch will have to adopt a “remote first” approach, lest they lose their coveted title of “industry standard”.

Embrace online collaboration tools as the new normal.

Even as offices reopen, online collaboration will likely remain an integral part of the design process. It is possible that a hybrid system of in-person and virtual interaction will be the new norm going forward.

At Atlantic BT, we are always testing new tools to streamline collaboration and quickly prototype. It’s impossible to ignore the advantages that online collaboration has afforded software and web development processes – with the right tools, that is!
June 14, 2021
Amplify B2B CRO in 2021.

Conversion Rate Optimization (CRO) has been an element of B2B digital strategy for years. But as more businesses rely on websites as a primary sales channel, bare minimum CRO strategies grow outdated. You’ll be left behind if you aren’t experimenting with CRO on a regular basis.

How did B2B businesses implement CRO in the past?

In the past, CRO usually meant A/B testing “as needed.” Tools like Hotjar or Crazyegg were the most common mechanisms to see how users behaved. You may have made small tweaks based on heat maps and recordings.

Platforms like Optimizely and Google Optimize were used as tools to test out new ideas or respond to perceived issues. For instance, maybe someone wanted to test using a new opening statement on the home page. Or maybe they realized people drop off on product pages so they tested some new layouts.

How is CRO changing for B2B companies now?

Frequency of tests increase.

Tools used for A/B testing and tracking site behavior are still relevant. However, the way companies are using them is changing.

According to Sitetuners.com:

“Businesses will need to shift to a longer-term perspective in their digital marketing and conversion rate optimization efforts in order to gain a sustainable competitive advantage. This means optimizing the entire business as opposed to tactical responses to issues that arise. Tactical optimization is useful but it can only do so much.”

Instead of reactionary, tactical testing; understand there is constant room for improvement and test every day. Make a minimum amount of tests required of marketing teams. After all, running 10 small tests is bound to provide more useful insights than 1 carefully researched test.

It’s also important to note that tests are only useful if results are compiled in a way that teams can easily draw insights. If not, it’s easy to repeat testing the same concept over and over instead of creating new hypotheses and moving forward.

AI amplifies opportunities.

The largest way we see AI impact CRO is with chatbots. In fact, Backlinko states that Chatbots saw a 92% increase in use in the past year, proving it to be the fastest growing communication channel. Roughly 41% of consumers claim to have used chatbots to assist with purchases, and 33% of consumers hope to be able to use a chatbot to make reservations online.

You may have also noticed that Machine Learning algorithms are built into search platforms, offering tailored recommendations for people searching. Additionally, real-time price adjustments may be applied to customers, maximizing the probability of a purchase.

Dynamic web pages make custom content easy.

There are many tools available to display dynamic content. This means that you can integrate software with your web platform that shows different versions of content based on a user’s behavior or data.

For instance, maybe your website is segmented by industries served. Someone who has viewed eCommerce content may be served with eCommerce resources. Someone who viewed eLearning content may be served with eLearning resources in the same content block.

Most Marketing Automation tools now offer dynamic content in both emails and web pages. Other site optimization tools, like Omniconvert and Optimizely, offer similar capabilities.

Page speed cannot be ignored.

User expectations for page speed are through the roof. A Google study found that 53% of mobile ad clicks immediately exited when load times exceeded 3 seconds. Furthermore, 47% of consumers expect a page to load in 2 seconds or less. A fast website is much more likely to hold users’ attention and convert.

Additionally, with Google core algorithm updates around the corner, it’s more important than ever to make load times a priority with your website. This update will include a factor called Page Experience, which heavily incorporates site speed into rankings.

Companies are investing in well-researched Information Architecture.

Information Architecture (IA) is the structural design of organizing information and its findability. For sites with large amounts of diverse content, a well-researched IA is critical to optimize conversions.

A popular IA question: should we group content by our personas, product and service lines, or industries?

The answer is – it depends. Building a successful site structure takes careful analysis of your business offerings and the tasks users wish to perform on your website.

Aside from organizing web pages into a clear structure, you’ll also have to organize data with clear labeling and categorization called taxonomies. Site search relies on taxonomies to serve users with information relevant to their queries. Your site search is only as useful as your taxonomies!

All in all, incorporating clear structure will help users navigate to needed information quickly, reduce frustration, and enhance search capabilities; in turn boosting conversions.

Looking for ways to enhance your B2B CRO strategy?

If you’re still doing the bare minimum with CRO, it can be difficult to choose the most effective newer methods to prioritize. Atlantic BT can help you build a roadmap and implement tools and best practices that will drive your business forward. If boosting site conversions is a primary goal, reach out for a free consultation to get started.

April 30, 2021
Streamline Web Design, Content, and Development with PDDs.
What are PDDs and what is their purpose in web design?

PDD stands for Page Description Diagram. It’s used to outline the content and elements on web pages and can improve the overall web design process. The elements are organized into low, medium, and high priority.

Showing wireframes too early on can trigger premature discussions around layout and design, no matter how bare-bones the wireframes appear. PDDs offer a solution. They come before wireframes to keep the focus on taxonomies, functionality, and prioritization. After all, web design should support desired content – not the other way around.

Outlining PDDs can also make the wireframing process much faster since everything is already outlined for the UX designer.

In special cases, it is even possible to skip the wireframes and hand PDDs straight to the designer. The drawback is that skipping the wireframes may inadvertently skip the UX designer’s interpretation of layout, flow, and interactions with the user in mind.

What does a PDD look like?

PDD’s can be created in several different ways, from a simple Google Doc list to a Sketch or Figma file with basic graphic elements. Atlantic BT prefers to use Trello, a kanban style list application, because it is easy to move elements around and collaborate with our clients.

No matter the tool, each list will represent a single page or type of page. Individual cards or bullet points within the list represent a component on the page.

Trello allows for tagging cards, which we use to identify the type of content of each card (call to action, metadata, search field, etc). Furthermore, the tagging can be used to indicate priority.

PDDs facilitate web design collaboration.

Collaborating with clients.

The ability to easily collaborate with clients is one of the benefits that make PDDs so attractive. Involving stakeholders in the web design process creates a shared sense of ownership and helps develop the list of components in more detail.

With Trello, clients can add comments and examples in real time to elicit discussions. Clients are empowered to include feedback from key players in their organization without having to schedule separate Zoom meetings.

Collaborating with web developers.

Making PDD’s available to developers early on is crucial, especially on website redesigns. Developers want to get a head start on migrating the content from the old website.

If it’s difficult for developers to translate a PDD to backend fields, it is important to agree on terminology to identify key elements.

For example, we collaborated with our development team to create a spreadsheet that contained what they needed for migration, most of which were copied straight from the PDDs.

Avoid common PDD pitfalls.

Don’t be vague with prioritization.

It may be helpful to develop definitions of high, medium and low prioritizations to stay focused on essential features. An example of these definitions are:
1. High – These elements are essential to the user’s understanding and functionality of the page.
2. Medium – These elements are useful to most user’s understanding and functionality of the page.
3. Low – These elements are nice to have but they do not contribute to the user’s understanding or functionality of the page.
During a website redesign, make sure that there is discussion around which elements stakeholders want to keep and remove from the original website. This will make handing off to development a lot easier.

Don’t focus on visual web design.

It may be tempting to add graphics to the PDDs to show stakeholders what pages might look like from a low-fidelity perspective. However, adding these visuals runs the risk of people getting stuck on the look and feel of the graphics, overshadowing the content.

Don’t let the nitty gritty details prevent progress.

Don’t spend too much time laboring over the details of the PDDs and going back and forth with stakeholders. Once there is enough information to start wireframes, move on. Lest you get stuck in an endless cycle of minutia.

Should you always include PDDs in a web design?

PDDs are a great way to prioritize and collaborate on the essential elements of main pages without getting bogged down by design details.

PDDs may also save time by skipping wireframes, avoiding some of the wireframe pitfalls. Inevitably, you’ll also lose the benefits that go with wireframes, so this is typically not recommended.

The great thing about PDDs is that you can spend as little time as possible or go into a lot of detail. They can fit comfortably into any system!

Need help streamlining the web design process?

Atlantic BT is well-versed in the strategy, UX, and technical aspects of a web design and development. If you need help planning your next web project, reach out for a free consultation.
April 1, 2021
What issues does a content audit expose?

When restructuring a complex website, an important first step is to inventory existing content and analyze findings in an audit.

The purpose of a content audit is to see which pages exist, decide which ones are valuable, and expose any hidden issues with the website.

Content audits tend to expose issues with site structure, technical SEO, orphaned pages, or content value. Take a look at how it works!

Unveil any strange categories, taxonomies, or hierarchical issues.

With an outdated or limiting CMS, many companies get in the habit of creating pages without housing them in a logical place. Websites can grow larger over time, creating a mess of page categories, tagging systems, and menus.

By closely examining pages, a content audit breaks down this mess to guide decisions about the restructure. And good news for you – with a combination of an updated CMS and clear site structure, it will be easy for you to create new pages moving forward.

Diagnose technical SEO issues.

A content audit can also help you diagnose any missed opportunities with SEO. And we’re not talking about expensive monthly backlinking campaigns. There are many ways to optimize your website for search engines by simply building SEO-optimized page templates.

The content inventory step will show all meta and H1 tags in plain view, allowing marketers to quickly find patterns in how they were generated. Are these page elements exceeding character limits? Missing keywords? Missing altogether? Your new website should have auto-generated meta tags that fall within guidelines. From there, follow best practices to manually optimize key pages.

At Atlantic BT, we will even take content audits a step further, cross-referencing additional tools to find slow pages and opportunities to incorporate schema markup.

Find orphaned pages.

During a content audit, we trace navigation to all pages and get familiar with paths users can take. If we see a page listed and cannot find a way to navigate there, it’s likely an orphaned page.

Orphaned pages, or pages that are impossible to get to by clicking through a website, are harmful for both SEO and user experience. According to Search Engine Journal:

Orphan pages aren’t great for either users or crawlers.

Users can’t reach those pages through your site’s natural structure so if there’s important or useful information on those pages, it’s wasted.

This can create a frustrating user experience.

With no internal links, no authority is passed to the pages, and search engines have no semantic or structural context in which to evaluate the page.

Without any way of knowing where the page fits into your site as a whole, it can be more difficult to determine which queries the page is relevant for.

If an orphaned page seems unimportant, you should likely delete it. If there is some value, we’ll find a way to fit it into a new site structure and ensure there is a navigation path.

Find groups of low-value content.

Do you have multiple versions of similar pages? A random tagging system for blog posts? Our team can determine the importance of content by referencing analytics data or understanding your business goals.

However, we consider a content audit a collaborative effort. We’ll rely on you to ultimately decide if a page is valuable for your business.

What step comes after the content audit?

An outdated website structure feels like a mess. Even after a content inventory reveals the existing site structure, it can be daunting to take steps toward simplification.

Based on our findings in the content audit, Atlantic BT can make recommendations for a new website structure. Does it make sense to categorize by industry, services, or personas? We can help you visualize the options and design a site that is simple for visitors to navigate. Give us a call to learn more.

March 11, 2021
Does your website need to be more functional or usable?
The simpler the website design, the easier it is to use. The more functionality a website has, the more useful it can be. With website design and development, the focus needs to be on maintaining a balance between usability and functionality to maximize user satisfaction.

People need to have access to features that help them complete tasks, but they also have to be able to easily find these features. Plus, they need to be able to comprehend how to use them.

What makes a website usable?

A usable website has a simple experience. It’s easy for people to find necessary information, complete tasks, and learn how to use features.

What makes a website functional?

A functional website has many operational features. Maybe users can add items to a favorites list, get a price quote from a calculator, make online purchases, or filter through content with search.

Achieving a usability and functionality balance pays off in website design and development.

If you can find a way to hit the sweet spot of balancing functionality with usability, you’ll reap the rewards. Crafting a this sort of experience with website design and development means:
- Increased customer satisfaction
- More online conversions
- Boosted brand loyalty and positive word of mouth
- Reducing frustration that leads to poor word of mouth or people calling support
Why do people clash over functionality and usability?

Usability and functionality can be considered a tradeoff in website design and development. It’s not easy to design a website to perform complex tasks while being simple enough for its intended users to handle.

You’ll have to face tough questions like: Are some features taking away from others? Are they cluttering the website? Can people find the feature they need? Can the average visitor use the feature easily?

Usually, designers will push back on stakeholders during this step. While a stakeholder wants to add as much functionality as possible to pages, a web designer needs to remind them that if everything is urgent, nothing is urgent. It’s a team effort to optimally prioritize elements of a page.

Testing is an essential step in website design and development.

Good UX is not about adding more features/options. It’s about improving interactions based on how a user wants and needs to engage with the system.

But how do you know what the user wants to start with? Most businesses incorporate a discovery step before development. At Atlantic BT, this phase includes UX workshops where we map tasks a user would perform on the site, interview or survey for more information, gather additional website requirements, and determine Information Architecture.

However, after Discovery, the best way to ensure a website is satisfactory is to test a prototype. You need to test what a user will actually do in a scenario (not just what they say they’ll do). For large projects, Atlantic BT tests prototypes of a research-based design to monitor usability before a launch.

Research, design, and testing can feel overwhelming.

Handling large website design and development projects in-house can feel overwhelming. Atlantic BT can help. Our streamlined process includes the careful research, requirements gathering, and testing needed for successful launches. Reach out for a free consultation.
February 22, 2021
Do breadcrumbs improve usability?
What are breadcrumbs?

Breadcrumbs are dynamic navigation paths throughout web pages. They show you the trail that led you to the particular page you are on with clickable links, allowing you to jump back to previous pages.

Breadcrumbs are most useful when websites house a large volume of information broken into clear categories and hierarchical structure. While a website like nestle.com should use breadcrumbs for its many brands, a local bakery probably should not.

Why should we incorporate breadcrumbs in web design?

You’re probably most familiar with seeing breadcrumbs on eCommerce websites. They helped you go back to a product category when you wanted to see other options. You knew to use this navigation element because you see them all the time; users understand the breadcrumb pattern well.

Breadcrumbs enhance UX.

Breadcrumbs are an important part of content strategy. They give users a roadmap to web pages and help them feel less overwhelmed. They are also beneficial because:
- They provide contextual information to help users understand categories.
- They make it easier for users to jump to previous pages without using the “back” button (when they likely forgot where it will take them).
- They tell users the pattern of a site’s structure so they have a better understanding of how to find other pages.
Breadcrumbs boost SEO.

Breadcrumbs are recommended for SEO for several reasons. Partly, search engines evaluate the user friendliness of a website. Breadcrumbs can help reduce bounce rate and increase pageviews per session for the reasons outlined above.

Additionally, breadcrumbs can boost crawlability and increase rankings because:
- Google uses breadcrumbs to gain context of content (just like users).
- Google includes breadcrumbs in the Search Engine Results page, giving users extra information that makes them want to click.
How do I get started?

Talk to your development team about how to add breadcrumbs to a website. For WordPress, it’s as easy as using breadcrumbs with the Yoast plugin. For other websites, it may require a custom development piece. A designer may need to find the best placement for this navigational element and provide styling as well.

Structured data helps you provide page information directly to the Google search engine. A developer or SEO specialist can also help you include structured data for breadcrumbs.

Looking for ways to boost user satisfaction and conversions?

Breadcrumbs are just one way to increase usability of your website. Atlantic BT also places value on content quality, information architecture, and UX design. If you’re interested in a site audit or consultation, reach out. We’re here to help.
February 5, 2021