The design and development industry continues to grow more competitively over the years. Agencies that have specific niches and all-around firms are popping left and right. Aside from those, there are also different types of development and design works.
As a player in this game, we are driven by our clients’ reception. We value their success and their feedback more than anything else because that’s how we will continue to thrive and grow.
We are OPTASY, a digital commerce, marketing, and web development agency based in Toronto. With 16 years of experience under our belt, we’ve experienced so many ups and downs that equipped us with the knowledge we need. We’re an internationally renowned and award-winning team that continues to work hard for our clients.
With that said, it has just recently come to our attention that we’ve been selected by Clutch, an established B2B review agency, as one of our nation’s industry leaders. Our team has ranked among the top Drupal and Magento designers and developers because of our spot on projects.
"We are thrilled to have been chosen as one of the leading web developers by Clutch!"
- Adrian Ababei, CEO of OPTASY, Inc.
Clutch also created a list of the top fifteen companies. They measured agencies’ ability to deliver and service focus to determine the industry leaders — and OPTASY ranked sixth on their Leaders Matrix.
In addition to that, our team is also found on The Manifest’s, Clutch’s sister site, top 100 mobile app developers in Canada list. This helps us prove that we can handle different projects and deliver phenomenal results.
These two recognitions are igniting our drive to further our success this 2021. We are grateful for those who support us, especially our clients. This means so much to the whole OPTASY team.
What can we help you with? Contact us and let’s start collaborating!
Adrian Ababei / Feb 15'2021
Ready to compare the features of 5 other best headless CMS in 2020?
We've got them ready for you to just dive in and:
survey the key reasons why you'd choose one over the other
discover each one's main use cases
narrow down your options
… and pick the one that matches your requirements.
What Is the Best Headless CMS in 2020?
5.6. Directus
An open source tool for managing and delivering content across an entire network of platforms and devices.
And here are some of the top reasons for choosing Directus:
it provides your editorial team with an easy to use admin app for managing content
it can be in the cloud or self-hosted
it provides API for your development team to fetch content
5.7. Netlify CMS
One of your top 10 headless CMS options, an open source one, that you get to add to any static site generator of your choice.
A React single-page application that provides you with an easy to use UI, playing the role of a… wrapper for your Git Workflow.
Basically, when using Netlify CMS your content gets stored in your web app's git repository (as markdown files), close to your codebase.
"How does a Netlify CMS Gatsby setup work?"
It's pretty straightforward:
You enter your content via that user-friendly interface, then Gatsby uses it to come up with the right pages for your web app.
Why would you use it?
it fits both large and small-sized projects, with fewer pages to create, to add content to, to edit, and to manage
you get to review/preview your content and make changes in real-time, and even control entries status in editorial workflow mode
it provides you with an easy-to-use UI, with just 3 tabs: workflow, media, and content
you're free to use it with any static site generator
you get to extend its functionality: add your own UI widgets, editor plugins, customized previews, etc.
5.8. GraphCMS
An API-first content management system, a GraphQL-native one, that allows you to distribute content across multiple digital platforms.
And not just anyhow, but… within minutes.
Your developer team gets to create content APIs in no time, whereas your content team gets all the tools they need for a smooth editor experience.
Source: capterra.com
GraphCMS vs Contentful: Main Differences
GraphCMS
works best for enterprise and mid-market companies, enabling them to build highly scalable applications
GraphQL is its underlying technology: an open source query language for APIs, that's been growing more and more popular among developers
Contentful
targets top global brands, helping them distribute digital content experiences across complex networks of markets and channels
REST is its underlying technology: a programming paradigm for distributed systems
And here are 2 good reasons for choosing GraphCMS as your go-to headless content management system:
you get a CMS that's client-side and JAMstack compatible
you get to tap into the benefits of a JAMstack approach to development (JavaScript & Markup & API)
5.9. Cosmic
A cloud-hosted headless content management system that provides you with both GraphQL and REST APIs.
But what makes Cosmic one of the best headless CMS in 2020?
Why choose the Cosmic Headless CMS?
it ships with features like content modeling, media management, localization, and webhooks
it grants you a smooth editor experience with its WYSIWYG editor, that you can use to incorporate (by embedding code) third-party services like Typeform and GitHub.
it integrates smoothly with AWS, Slack, Algolia, Stripe, HubSpot
5.10. Kentico Kontent
A cloud-based content delivery API that turns your structured content into content that's easy to be "consumed" by any device or digital platform that you might use as a front-end delivery layer.
Why would you choose it over other great options of headless CMS?
you get an AI chatbot when using Kentico Kontent
it provides webhooks and custom elements that make third-party integrations a lot smoother
you get content management API enabling content consumption
And we've come to… the END of the list of 10 best headless CMS in 2020.
Which one checks the most features off your list?
Now, if you're facing a "Headless Drupal 8 vs Contentful" dilemma, we're here to:
help you identify the one that works best for your business and your requirements
make your headless CMS-based project work
Just drop us a line!
Image by tdfugere from Pixabay
Adriana Cacoveanu / Sep 26'2020
Overwhelmed with options?
Are you building your first (e-commerce) headless CMS and you don't know what headless CMS platform to choose?
What are the best headless CMS in 2020, so you can at least narrow down your choices and start... somewhere?
Which system matches most of your feature requirements?
Here's a top 10:
1. But First: What Is a Headless CMS, More Precisely?
Relax, I won't bore you with too many details — we already have an in-depth post on the differences between headless and traditional CMS.
So, if we were to sum up the concept in just a few words, we could say that:
A headless content management system is an architecture where content is separated from the presentation layer (the client-side front-end).
Meaning that you get to create, store, and edit "raw" content (with no design or layout) in the backend and deliver it wherever needed —wearable, mobile app, website — via API.
In short, what you get in a headless architecture is:
a database to store your content in
a dashboard for editing your content
Source: Zesty.io
As for the "head" that serves your content to the end-user :
you're free to build your own front-end, from the ground up
… and even multiple front-ends, if needed, that will all use calls from the API to retrieve and display content
2. … Then What's a Decoupled CMS?
Headless CMS vs decoupled CMS: what's the difference? And why headless over decoupled?
The role that the API plays…
That's what makes the difference (and why you'd want to go for a headless approach):
If, in a decoupled architecture, the API plays the role of an intermediary between back-end and front end, in a headless architecture the API can be used by any of the front-end portions for pulling data.
In other words, a decoupled CMS does come with a built-in front-end delivery layer, that you can rely on, but a headless approach is an API-driven content repository.
Which gives you more flexibility for delivering content to any type of display layer.
… to multiple "heads".
You're free to distribute it wherever it needs to get displayed.
3. Why Choose a Headless CMS? Top 9 Benefits
Before I "divulge" the best headless CMS in 2020 to you, here's a shortlist of the key advantages of using a headless CMS software:
you get to engage your customers with personalized content across an entire network of digital channels, at different stages in their journey
you can deliver richer digital experience, tailored to each channel
you gain platform independence
you're free to choose your technology of choice
you benefit from cross-platform support
you get to manage your content from a central location and distribute it to multiple platforms/IoT-connected devices, in a universal format
you're free to manage all your platforms from one interface
your development team gets to choose the development framework of their choice, integrate new technologies and, overall… innovate
you're free to redesign as often as you need to, without the dread of re-implementing your entire CMS from the ground up
4. … And When Should You Use It? 5 Best Use Cases
How do you know for sure that you need to adopt this approach?
You know it because your scenario describes one of the following use cases for headless CMS:
you're building a site using a technology you're familiar with
you're building a website with a static site generator
you're building a JS-based website or web app
you're building a native mobile app
you're building an e-commerce site and you know that the commerce platform you're using won't… cut the mustard as a CMS; or you need to enrich product info in your online store
5. What Are the Best Headless CMS in 2020? Top 10
"Which CMS should I use?" you wonder.
"The one that meets most of your requirements…"
So, you should start by pinning them down. What features are you looking for in a CMS?
Maybe you need a system that should:
be straightforward and easy to use for the marketers/non-technical people in your team
be built on… Node
be highly customizable and editable for your content team to be able to change overlay text, logo, background video/image
be simple to set up
integrate easily with Gatsby
support multi-site setups
not be tied up to (just) one specific database
provide ease of content entry and rich-text support
provide a granular permission system
provide native support for content types
What are the features that your project couldn't live without?
Now, with that list of "mandatory" features at hand, just drill down through your top headless CMS options in 2020.
Here they are:
5.1. Storyblok
A purely headless CMS that ships with a visual editor, as well.
Why would you go for Storyblok? What makes it one of the best headless CMS in 2020?
it provides the experience of a page builder for all those non-technical users in your team: editors get to manage content via a more user-friendly interface
it grants your developers easy access to the APIs they need
5.2. Prismic
Its major selling point?
It allows you to choose your own language, framework, technology…
And these are the 3 good reasons to go with Prismic as your headless CMS:
it allows you to model your content schema and to add your content
you're free to choose whatever framework that meets your feature needs: React, Vue, Next, Nuxt, Node, Gatsby…
you're free to choose either GraphQL or RESTful API to query content
5.3. Drupal 8 Headless CMS
Another great option is to exploit Drupal's headless capabilities and pair them with the JavaScript framework of your choice.
Here are some of the best reasons why you'd use a Drupal 8 API-first architecture:
Drupal's a mature and enterprise-level headless solution backed by a wide community, used by more than 1 million sites globally; you get to tap into its massive module collection and even create new custom ones to extend your website's functionality
its JSON:API follows the JSON:API specification; developers in your team can start using the API even if they're not experts in working with Drupal
you get to load your GraphQl schemas straight from your Drupal content repository; there's a specialized module for this: the GraphQL module
you get to use all of Drupal's famed features (granular access to content, processes, workflows, modules, etc.) right away; you get them out-of-the-box since the REST API is… rooted deep into Drupal
5.4. Strapi, One of the Best headless CMS for Gatsby.
It's an open-source Node.js headless CMS, a "host it yourself" one, that allows you to build Node.js apps in… minutes.
Why would you use it?
because it generates available RESTful API or uses GraphQL shortly after installation, making data available via customizable API
because it allows your developers to invest all their resources in writing reusable app logic (instead of having to use some of that time to build an infrastructure)
because it's fully JavaScript
because it supports plugins that extend the platform's functionality
because it's open-source: you'll find the entire codebase on GitHub
5.5. Contentful
Looking for a platform-agnostic solution?
A… content delivery network that would enable your development team to manage and distribute (and reuse) content to multiple channels?
Then this is the API-driven headless CMS you're looking for.
Here are 6 other reasons why you'd want to put Contentful on your shortlist:
consistent APIs
easy to set up
you're free to create your own models
easy to use: ships with a robust, non-technical, user-friendly UI
you get to add custom plugins quick and easy
you get to set your own schemas to get displayed the way you want them to, across different apps
Good to know! There's even a Shopify extension available. What it does is connect your online store to your content, stored in Contentful.
And if you'll need help with building, fine-tuning, and integrating your content hub, we're ready to tweak Contentful to your needs.
END of Part 1!
Stay tuned, for there are 5 more candidates for the title of "the best headless CMS in 2020" waiting in line.
Image by Couleur from Pixabay
Adriana Cacoveanu / Sep 25'2020
A bit stuck? Are you looking to roll out your online store, but… you’re struggling with a Magento vs Shopify 2020 dilemma?
Which solution works best for the size and the type of your eCommerce business?
Which one covers most of your feature needs?
In today’s post you’ll get your answers to the following questions:
How are they different?
Why would you choose Shopify over Magento? What are its strongest selling points?
What are the cons of Shopify?
What are the pros and cons of Magento vs Shopify?
Which eCommerce platform works best for your type of business?
1. What Are the Major Differences Between Magento and Shopify?
The main reason why you’re torn between Magento and Shopify is that:
You don’t have a clear picture of the essential differences between them.
So, let me expose them to you:
1.1. Magento is an eCommerce solution for enterprise-level online stores.
It’s robust and flexible enough to power fully customized eCommerce websites, built from scratch — that you can further expand to fit your growth plan — by teams of Magento developers.
1.2. Shopify, on the other hand, is self-managed.
You don’t need any specialized skills — or server-side techs — to set up a Shopify store.
A front-end developer and a designer, at most, will do.
“How easy is it to use Shopify?”
Shopify is best-known for being beginner-friendly.
In short, the “Magento vs Shopify” dilemma comes down to:
Flexibility and customization vs Ease of use.
Which one's more important to you?
2. Magento vs Shopify 2020: Why Would You Choose Shopify?
What makes Shopify a candidate for the title of “the best solution for creating an eCommerce website in 2020"?
Here’s why Shopify could be the better choice for your online store:
you have no (or limited) coding skills
the idea of having a huge app marketplace at your disposal to browse through sounds tempting to you
you need to get your e-Store up and running… now: the drag-and-drop website builder allows you to set up a new store in… minutes
it’s an end-to-end eCommerce solution that you’re looking for, one that enables you to roll out and manage your online store with no technical experience
it’s easier to use: its interface is famous for being particularly user-friendly
you run a small or medium-sized eCommerce business
page loading time is critical for you: Shopify’s just… fast
Overall, it’s much less of a headache than Magento and usually the go-to option for small eCommerce business owners, with no web development experience, who need to get their websites rolled out fast.
3. What Are the Cons of Shopify?
What could make you hesitate to choose Shopify for your eCommerce website?
For there are, indeed, some limitations to consider before going for this particular platform:
You’d be trading some of the control over your online store for… ease of use and the convenience of setting up your eStore quick and easy, with no technical expertise
You do get a huge collection of plugins to choose from but… they all come with a price tag on; one that you’ll need to consider when planning out your budget
You won’t be able to customize every single aspect of your website. By comparison, Magento puts no limitation on the configurations that you can make to your site
Shopify provides you with weaker SEO features
It charges a transaction fee per… sale
4. Why Would You Choose Magento over Shopify?
When dealing with a Magento vs Shopify 2020 dilemma, what could make you opt for Magento?
Lots of reasons... Here are the strongest ones:
It enables you (or your team of Magento developers in Toronto) to customize everything about your eCommerce website, from theme to checkout process, to main menu, to email template, to...
You get to build custom functionality for your website, that’s not available on the market
You have lots of extensions available to choose from — Magento being open-sourced — and to customize your online store
You benefit from its strong SEO capabilities
You get to tap into its multi-store functionality: Magento enables you to manage all your online stores from one central dashboard
“In fact, according to eCommerce Platforms research Magento SEO scores 95 out of 100, and that is great result!” (source: Cart2Cart )
In short, you’d want to go with Magento because it enables you to build pretty much anything that you might need for your eCommerce website.
5. What About the Cons of Using Magento?
For you need to be aware of the disadvantages of using this eCommerce solution, as well, before you make any decision.
Now, here are the most… discouraging ones:
Building a fully customized website in Magento takes time and requires web development experience and Magento expertise; you can’t get away without a team of back-end Magento developers to handle the whole process and all the customization wok
You do have a large and thriving community to rely on, but no 24/7 dedicated support (like you have with Shopify)
You’ll need to optimize your Magento website on a regular basis to make sure it keeps performing at its best
You’ll need to take into account the cost of all the extensions that you might want to add, of the web hosting service, and the Magento expertise needed
6. Magento 2 vs Shopify vs... Shopify Plus: Which One’s the Best Fit?
Considering that, starting June 2020, Magento 1.0 is no longer supported, your Magento vs Shopify 2020 dilemma turns into: “Magento 2 vs Shopify”.
What new features does Magento 2 bring to the debate?
simplified navigation
(even) better customization capabilities
better performance
a more admin-friendly panel
drag-and-drop layout editing
improved checkout
“And what about Shopify Plus?” you might then ask yourself.
Here are some of the enhancements that Shopify Plus ships with, so you can see for yourself whether it’s the best fit for what you’re looking for:
It gives you greater control over your online store: you gain more customization freedom
It’s robust enough to handle more than 10,000 transactions per minute, which makes it a viable alternative to Magento 2 for enterprise-level eCommerce businesses
You’re free to edit your checkout page (a feature that’s not available in Shopify)
You get your own launch manager: basically, a dedicated Shopify Plus team will handle everything for you, from implementing the custom Shopify theme that you need to code writing
7. Which Commerce Platform Works Better for Your Type of eCommerce Business?
Now that you have a clear(er) picture of the pros and cons of Magento vs Shopify, how do you know which one’s the best fit for you? For your business goals and size?
It’s simple: just pick the answer(s) that best fits your scenario from the following ones:
You’ll want to use Magento if:
you have a large product catalog
your customization needs are… above the average (i.e. complex product configurations): you want a fully customized online store built from the ground up
you need a commerce platform robust enough to support your entire network of vendor/supplier fulfillment channels
you have qualified Magento developers in your team (or the budget to hire some professionals, who know what they’re doing)
You’ll want to use Shopify over Magento in 2020 if:
it’s a small to medium product catalog that you need to set up
being able to integrate/cross-sell on multiple platforms is a crucial feature for you
you need to get your storefront online as quickly as possible
Does this head-to-head help you with your Magento vs Shopify 2020 dilemma?
No matter which one’s the “winner”, the next question stays the same:
“How do I get my Shopify/ Magento website built and suited to my needs?"
Just drop us a line and we’ll have either our Shopify or our Magento ecommerce developers assigned to your eCommerce project!
Image by Photo Mix from Pixabay
Adriana Cacoveanu / Sep 18'2020
So, you’d like to build an app with React. And, while weighing your back-end options, you ask yourself: “Why use Node.js with React?”
Why would you go with Node for hosting and running your web server?
Why not… Ruby on Rails? Or maybe Python/Django?
This is precisely what you’ll find in this post: the 11 main reasons why you’d want to choose Node.js as a backend for your React web app:
1. But First: What Is the Difference Between ReactJS and Node.js?
We already have a blog post focused precisely on the React vs Node dilemma, so in today’s post I’ll only pinpoint, briefly, the main differences between the 2 technologies:
While ReactJS is a front-end library, Node.js is a highly popular choice for back-end development (thanks to its event-driven nature and to being asynchronous and highly scalable)
While React provides you with a language to describe the user interface of your web application, Node.js helps you with all sorts of (back-end) things like setting up your server, building CLI tools, scripting; a key difference to help you solve your “React vs Node.js” dilemma
While ReacJS helps you build your UI components, Node.js stores your app’s data in the backend
While React is web app developers’ top choice to address challenges like low performance and slow user interface, Node.js is the go-to technology for creating enterprise-level solutions based on WebSockets, event quests, and microservice architecture.
2. Does ReactJS (Really) Require Node?
In other words, do you need to have a Node.js backend to run React?
No, you don’t.
Node.js is not required for running Reactjs.
So, why use Node.js with React?
There are certain use cases and reasons why you’d want to pair the 2 technologies for building your app:
you cut down on your web app development time (which always has a major business impact)
the Node.js and React duo is your ticket to scalable and efficient code
…
But more on the strongest reasons why you’d use Reactjs with Node down below...
3. Why Use Node.js with React? 11 Top Reasons
Now, going back to your initial question — “Why do you need Node.js for React?” — here are the key reasons why you’d go with this “duo”:
3.1. Because they’re both JavaScript: you can execute them server-side and client-side
The benefits you get from having a JS-based technology in the back-end, as well, are obvious:
you only need to be familiar with JavaScript (no Ruby or Python expertise needed)
same language means… same packages
same language means that you get to speed up your app’s development process
3.2. Because you get to inject V8 engine performance into your React app
In other words, your React app will be perfectly equipped to handle bulk requests with no compromise on quality.
The V8 engine that Node.js uses grants your app the best page load times.
3.3. Because you get a collection of NPM packages to choose from
With the NPM CLI at your disposal, you get to install any of the packages available in the registry quick and easy.
3.4. Why use Node.js with React? Because the “duo” helps you address high server load issues
They work perfectly together to help your app handle multiple client requests while striking a server load balance.
3.5. Because Node.js bundles your app into a single, easy-to-compile file
Using various modules along with Webpack, Node Js bundles your app into one file. One that can get compiled much easier...
3.6. Because it’s a real-time, data-intensive React app that you’re building.
Does your React application depend on Data Streaming or Data-Intensive, Real-Time management?
Is interactivity a major requirement for your web app? Is it a real time application that you have in mind?
Then Nodejs makes the best choice for continued server connection in a context of intensive computation.
3.7. Because you get to run React.js code straight in the Nodejs environment
3.8. Because you get to scale your React & Node.js app to much higher loads
A Node.js back-end will help your app accommodate many more users and many more future calls.
It's your best option for building scalable applications.
The 2 giants are using Node.js precisely for its great scalability potential.
3.9. Because you get to build JSON APIs for your app much easier when using Node and React together
How come?
You get to share and reuse code in React.js quick and easy when you pair it with Node.js in the back-end.
3.10. Because rendering server-side becomes a more streamlined process
Since React DOM comes with components built to work with Nodejs out of the box, you get to cut down on the lines of code.
Which translates into streamlined server-side rendering.
3.11. Because it’s a single-page React app that you’re building
The “React with Node.js” duo makes the best choice for building a SPA.
The lightweight Node backend will be in charge of handling asynchronous data loading via callback functions.
4. In Short, You’d Want to Use React and Node.js Together Because...
“Why use Node.js with React?”
As a conclusion, we could narrow down the entire list to just 2 key reasons:
Convenience: same language in the back-end and the front-end; Node.js makes the go-to option for running and hosting a web server for your React app
ReactJS depends on Node and npm (Node Package Manager) to notify the native side (iOS/Android) of the packages that you need to use in your app; then, it can add all the needed dependencies.
The END!
Now that you know why and when you’d want to use React with Node.js: how do you build that high-performance, conveniently scalable React & Node.js app?
We’re here to help you get the most of these 2 technologies.
Just drop us a line to have a team of React and Node Js developers handle your project.
Image by Anemone123 from Pixabay
Adriana Cacoveanu / Sep 16'2020
Is it (still) too early to give Drupal 9 a try? To start fresh and build a website from scratch in the latest version of Drupal?
Should you stick to Drupal 8 for... a little longer and upgrade later?
How difficult will it be for you to find compatible Drupal 9 modules (and themes)?
Let's find out:
1. But First: Why Drupal 9?
What are the biggest benefits of Drupal 9 over Drupal 8?
Why would you choose precisely this version of Drupal to build your new website with?
because of the automated updates that it makes possible
because of the headless support that it ships with
because of the robust multilingual capabilities
because of the improved performance: your web pages will load faster thanks to the BigPipe technology
because it removes a lot of the legacy code
because of its layout features
because of its extensibility: you get to incorporated third-party systems quick and easy
because of its media library and robust media functionality
because of the new, Twig-based theme engine
because it's easier to use: you can make the most of its in-place editing (CKEditor)
And particularly because there will be no more major re-builds (aka "major pains to upgrade").
Instead, a set of new features gets released every 6 months, including new improvements and additions to be incorporated seamlessly into your Drupal 9 build.
2. Most Drupal 9 Modules Don't Change at All
So, stay assured: you won't be having a hard time finding compatible modules for your new Drupal 9 website.
Many of the modules on Drupal.org have been, are being made, and will be made compatible with Drupal 9. There's a collective effort coming from the Drupal community in this direction.
And where do you add that the process is pretty straightforward:
Same code, but without the deprecated APIs.
3. But What About Those that Do Need Changes?
For there have been changes under Drupal 9's hood. Changes in coding with a direct impact on some modules and APIs.
Which means that some modules have turned from Drupal core modules to... outside dependencies:
this is good news, considering the performance gains you get
but also a challenge if you were relying precisely on those modules for your Drupal 9 website
Luckily, you have at least 2 helpful tools at hand that you can use to:
identify the Drupal modules that still need to get updated
apply the fixes needed to make those modules compatible with Drupal 9
3.1. The Upgrade Status Module
Why use it?
Because it offers you a view of all that has been changed in Drupal.
Source: Drupal.org
You have links to the modules' pages there, that you can access to review those changes.
3.2. The Upgrade Rector Module
The great thing about this tool is that it provides you with automated code fix suggestions to help you make your target modules Drupal 9 compatible.
Source: Drupal.org
4. Some Module Get Removed from Drupal 9
Now, there are a few Drupal modules that didn't get the chance to grow into Drupal 9 modules.
And I'm talking here about:
Simple Test, that's now replaced by PHPUnit
Place Blocks, now replaced by the Layout Builder
As you can see, in both cases you get to use better alternatives. So, it's just a matter of favoring more powerful solutions.
Good to know! Expect other modules and themes (i.e. the Classy theme, the Stable theme) to get deprecated and removed by the time we reach Drupal 10.
5. What About the Contributed Modules?
What if you need more than the out-of-the-box Drupal 9 modules to build your new website?
What if you depend on particular contributed modules? Or on... many contributed modules?
Well, then things get a little more challenging...
Because many of the contributed Drupal modules still need to be made compatible with Drupal 9. They need some time to catch up with the new version of Drupal.
Take for instance: updating tests to PHPUnit or updating deprecated API usages.
Now, what you can do is give a helping hand to accelerate the updating of these modules.
And the steps/best practices to follow are pretty simple, as suggested in this guide on Drupal.org :
use the patch referred to here, create an issue in the module project (first, make sure it doesn't exist already), and choose a title suggestive enough to let the maintainer know that it needs to be tested for Drupal 9 deprecations
add an explanation for the signaled issue
... and follow all the other steps suggested in that Drupal.org guide.
Tip! Ask that contributed module's maintainer how he/she would like to address the issues you're signaling.
Because the guidelines available for Drupal core aren't always relevant for addressing contributed module issues, as well.
The END!
Now, assuming that:
you only need a limited no. of contributed modules for your new Drupal 9 build
it's not a heavily customized website that you're building
... how do you get it up and running in?
We're here to help. Just drop us a line!
We've been building Drupal websites since... Drupal 5.
Image by Siggy Nowak from Pixabay
Adriana Cacoveanu / Aug 28'2020
A few weeks ago, I had the chance to take the Acquia Site Studio (formerly Cohesion) Certification exam.
In this post we are going to discuss why I took this exam and more importantly, how I passed it and became an Acquia Certified Site Studio Site Builder.
Optasy and its commitment to quality through knowledge
You already know that quality is part of the corporate culture of Optasy. For us quality is a key factor to protect our clients' investments and guarantee them a high ROI. But having a good QA department is not enough. Actually, it's often too late when the QA team detects an issue.
At Optasy we prefer to ensure quality at the early stages of our projects, analyzing deeply the needs of our clients and transform them into effective digital experiences but we also know that the quality of the code we produce comes from the experience and the skills of our developers.
That's why Optasy has an internal 'skill knowledge acquisition program' to help its employees (optasians) to acquire new skills or improve them. This program gives to each optasian one day off per month (paid by the company) to study a particular field. As a way to ensure knowledge acquisition and validation, optasians also receive paid leave to study and give their Acquia certification exams. This includes the exam cost too, that’s why many of the optasian developers are actually Acquia Certified developers or Acquia Certified site builders
All things considered, it was a pretty easy choice for me to take the exam, not only do I get to improve my skills, but I get paid for it too!
What are the Acquia certification programs?
Acquia is a preferred Optasy partner that delivers a cloud-based digital experience platform built on Drupal that enables organizations to build experiences that scale. Acquia is committed to facilitating certification programs allowing developers to validate their Drupal skills year after year.
Acquia certification exams are administered at Kryterion Testing Centers in more than 750 locations across the globe. Exams are also available as online-proctored tests and are often offered at DrupalCons across the world.
What is Acquia Site Studio?
Acquia Site Studio (formerly Cohesion) is a low-code solution for building and editing Drupal sites. As an Acquia partner, our team got the chance to become an early adopter of the technology.
Acquia Site Studio is a sort of layout builder on steroids without writing any line of code. Not only can you build layouts or templates, but also you can build whole websites from the headers to the footers, and everything in between, like components and widgets, just by using the interface. No code required!
It's a kind of atomic design system (like Pattern Lab) where you can create and preview CSS style guides, components, template layouts, page layouts or view layout from a visual user interface with simple “drag and drop”. And all of this within your Drupal site!
To be fair, Acquia Site Studio is an amazing tool allowing designers and marketers to create and modify any layout component without calling the development team. If you’re a designer with no coding knowledge you’ll be able to create totally unique layouts based on your designs using intuitive drag and drop layout builder. If you're an editor, you may choose the layout you want to use and add all the pre-designed components you wish. Want to add a slider or a 'Related Articles' block? You drag and drop it in your layout!
5 tips to successfully pass your Acquia Certified Site Studio exam
As other Acquia Certification exams, the Certified Site Studio exam requires both experience and knowledge. Though the test is not difficult, it’s not something you want to run into unprepared.
From my experience, the questions ranged from a very low to medium range of difficulty, there were barely any difficult questions.
This exam validates your ability to:
Understand the features and functionality provided by Site Studio
Install and configure Site studio environment on new or existing websites.
Build a website using Site Studio style builder, components and website structure design elements.
The official description of this exam can be found on Acquia's certification overview page. But in short:
The tests are all multiple choice.
They don't require that you actually configure a Drupal site or write any code.
They are available in person at a testing center, or at home by installing the exam software on your computer.
The price was $155 (In my case, Optasy paid for the test)
Get a good understanding of Drupal Layout Builder
As I mentioned earlier, Acquia Site Studio is a Layout Builder on steroids and many concepts are the same, so having some experience with this Drupal module will help you a lot, like the inline editing tools or the concept of drawing element into the layout. This is not mandatory, but I felt really comfortable with Site Studio having this previous experience.
Read carefully the contents of the exam
On Acquia's certification overview page you'll find the blueprint of the exam like the following:
But below it, you'll find the content itself. Read it carefully and repeatedly. This should be your guideline during your study. This will help you focus on what really matters but also to recap and structure your notes.
Read and study the documentation
While there are really good videos on the Acquia Academy site about Site Studio, watching all of them won't be enough. If you don't have prior experience with Site Studio, it's a good starting point. But it definitively won't give all the knowledge you need to pass the exam.
Reading the documentation should sound obvious, but you'll really need to read and study all the documentation in depth. Don't leave anything behind cause the exam covers all the aspects of Site Studio, from the basics to more advanced topics.
This will also give you the right vocabulary to understand the questions of the exam, since sometimes they can try to trick you changing just one word. So the technical vocabulary has an important role, and that's where the documentation comes into play.
Write down some notes after reading each section. This will help you a lot during the recap!
Train on the Acquia Site Studio demo environment
You can request an online demo environment for free at the bottom of this page
The main benefit is that you won't need an API key or an Agency key, so you can test Site Studio for free, the environment acts just like a normal Drupal website. and the site will be all yours to experiment on.
This site will be your friend during your study, you should test everything you learned in the documentation here. Do it several times and try different cases.
The night before the exam, after reading back your notes, try to build a site from scratch in this environment to recap all the main concepts. This is key!
Don't forget the 'Miscellaneous concepts and features' part
These three concepts are not placed in one section, they are dispersed in the documentation. Study and practice all of them because you'll have a question about each one. They are only three, it doesn’t sound like a lot but they are worth 15% of the exam! That is a quick and easy win!
A bonus tip
What really worked for me was to read a section, practice the concepts of this section in the demo environment, read again the same section and take some notes. The day after, read all the notes of the previous day, do the same 7 days later, reading back your notes and practicing again on the demo site. That way, 80% of what you studied will stay forever in your memory.
Conclusions
Acquia Certification Site Studio Site Builder can be a good way to validate your skills and knowledge
There are barely any difficult questions
Study all the documentation because the exam is based on it, but also because the exam will cover all of it.
Practice a lot, recap a lot.
Karim Boudjema / Aug 27'2020
How precisely does a user journey map help you improve the user experience on your website/app?
What are the benefits of customer journey mapping?
Should you expect a direct impact on your conversion rate?
In other words, why would you bother creating one?
In this post, I've listed the 7 best answers (or “benefits”, if you wish) to your legitimate question:
“Why use customer journey mapping?”
1. But First: What Is a User Journey Map?
What exactly is a customer journey?
And why should you bother... mapping it?
It's a timeline that shows all the touch points between the user and your website or application, along with the emotions, motivations, and thoughts that he/she experiences at each step of the process.
A shorter “definition” would be:
A user journey map is the visualization of an individual's relationship/experience with your website/app across different channels that he uses to interact with it, over time.
Does this answer your question:
“What is user journey mapping in design thinking?”
With this map at hand, it becomes easier for you to... locate the weak spots, where you need to improve the user experience...
Too many teams focus almost exclusively on the user experience at the top and on the bottom of the sales funnel and underestimate the steps in the middle.
So, they ignore precisely those touchpoints that drive conversions...
2. Why Use User Journey Mapping? Top 7 Benefits
What's the purpose?
Why and when to use a user journey map? What design problems does it help you solve?
Here are 7 strong reasons why you'd want to bother mapping users' journey on your website:
2.1. It urges you to adopt a more user-centric approach to web design
In short, you get to see your website/app through the user's eyes.
From his/her point of view.
You step into the user's shoes, see how the user interacts with your site, and detect those areas of the user experience that... could be better.
2.2. It helps you answer your “What if...?” questions
In other words, with all the valuable information of a customer journey map at hand, you're free to brainstorm ideas.
To plan new features, ambitious updates for your website that would:
improve the user experience
increase engagement with your website
and eventually... boost conversions
2.3. It enables you to make strategic recommendations backed up by UX data
Are you monitoring quantitative KPI metrics in your company?
If so, then a user journey map will help you back all your future recommendations for improving your site's performance with user experience data.
2.4. It helps you see where exactly your website doesn't meet the user's expectations
By mapping the customer journey, you get to detect those specific systems and processes — part of the user's journey on your website — that are not aligned with his/her expectations.
And to address these inconveniences that are costing you sales.
2.5. It helps you identify opportunities and pain points in the user experience
Opportunities that, otherwise, you might just... overlook.
And which you can now tap into for... further research (the “what if” question, remember?)
A customer journey map helps you visualize both successes — where your website performs best from a UX standpoint — and areas where you could make an impact.
2.6. It gives you a realistic picture of the user experience on your website
Maybe you're convinced that you're doing a great job, yet users are having a really bad experience.
Mapping the user journey will provide you a realistic evaluation of the situation from the user's perspective.
2.7. It helps you evaluate the impact of the changes that you make to your website
A user journey map makes a great tool for measuring the impact of the updates that you make.
Updates that you'll decide to implement based on the information that such a map will provide you with.
To sum up, here's a short inventory of the benefits that you get from mapping the user journey:
you improve your website's/app's design
you improve conversion funnels
you can compare the experiences of different audience segments
you get to “fuel” your user research
you get to measure the impact of touchpoints
3. How to Create a User Journey Map: 8 Steps
Now that you know why you'd want to map your user's journey on your website, let's see how you do that.
What key stages should your user journey map template include?
And I've broken the whole process down into 8 simple steps:
Step 1: Set a scope for your customer journey map
Which could go from a high-level map — the end-to-end user experience — to a more elaborated map, that focuses on one specific user interaction (i.e. filling in the check out form).
Step 2: Create your user persona
To put together an accurate persona profile, you need to do some user research.
Collect as much relevant information about your target audience as possible before putting together the user persona's profile.
Step 3: Determine the scenario and the user expectations
For instance, a scenario could be: buying an item from your store using your eCommerce app.
Whereas the user expectation, in this case, could be: having that item delivered in 2 days at most.
Step 4: List the touchpoints
It's that step in creating your user journey map where you make a list of all the user actions and interactions with your website/app, as well as of all the channels associated with them.
Step 5: Define the problem that the user's trying to solve
What's the user's motivation/intention?
What drives him/her to interact with your website?
Is he/she looking for more information on your products/services?
Or has he accessed your website to buy a specific product?
Step 6: Make a Sketch of the User Journey
With all the information you've collected up to this point, put together a step-by-step interaction map.
Where each “step” stands for a specific experience that the user persona has when interacting with your website.
Step 7: Pinpoint the user's emotional state at each step in the journey
What does the user feel at each step of interaction with your website/app?
This empathy map will help up visualize the “ups” and “downs” in the user experience, so you should know where to... intervene.
Step 8: Validate and adjust the user journey accordingly
Rely on the information you will have collected during your usability testing sessions and from your app analytics to put your user journey map against a real use case.
No matter how truthful your map might look to you (since you know it's based on intensive user research), it's crucial to validate it and to... adjust it, if needed.
4. User Journey Mapping vs User Story Mapping
“Is a user journey like a user story?”
Well, there are some key differences to be aware of.
What's a user story?
user stories describe small, specific tasks
a group of user stories forms an “epic”
they're essential for user acceptance testing and agile development
The standard formula for creating a user story statement if the following:
As a..., I want to..., so that I...”
For instance:
As an SEO specialist, I want to keyword-optimize this text, so that the website ranks higher in Google search results.
And how is a user journey map different from a user story?
When you map a customer journey you start with post-in notes on a whiteboard.
You:
determine who your website/app addresses to
sketch the big picture
detail each “epic”
define a release strategy
define a learning strategy (small experiments to minimize risks)
define a development strategy
Is it much clearer to you now why you need a user journey map for improving the UX on your website, but the process seems too... time-consuming to you?
Just shift the burden to us then...
Drop us a line and let's identify all those opportunities for improving the experiences your users have when interacting with your site/app.
Silviu Serdaru / Aug 26'2020
Should you start by analyzing your competitors or... by building the user persona for your new software product?
Then, should you jump straight to paper sketching or...?
How to approach user experience design, more precisely?
What are the key steps to include in this process? And what's the right order to carry them out?
What are the specific activities to perform? What deliverables should you create at each step?
Let's get you some answers now.
Here's how our own UX design process looks like. Take it as a tried-and-tested 8-point checklist.
One that you can use to make sure that you complete the end-to-end cycle when designing the user experience for your apps (or websites).
But First: What Is User Experience Design?
“If UX is the experience that a user has while interacting with your product, then UX Design is, by definition, the process by which we determine what that experience will be.” (Source: usertesting.com)
Let's try an ultra concise, yet comprehensive definition:
UX design is... design has the user's experience at its very core.
So the process of designing the best experience for your users calls for a step-by-step approach where you:
do extensive research, trying to understand your users' needs and problems
collect a whole lot of data that'd help you figure out how users interact with your product (so you can anticipate common user flows)
plan out everything, all the elements that go into your software product are thought through and designed from the user's viewpoint
run extensive user tests on your prototype
The whole point of this step-by-step user experience design process? (or why is user experience design important?)
It helps you answer your “Why”, “What”, and “How” questions related to your product before you go ahead and... develop it:
Why would target customers use your product? Does it help them perform a specific task? Or does it reflect some of their personal values, maybe (i.e. Apple users identify themselves with people who “think differently”)
What helps them perform the actions that they expect to perform with your product (which of your product's features and functionalities)?
How do they perform those actions? Does your app provide an easy and aesthetically pleasant way for them to carry out their tasks?
Source: usertesting.com
1.1. User Experience Design vs User Interface Design: How Are They Different?
Take UI as everything that the customer comes into contact with when using your app.
From the graphics he sees to the on-screen buttons he touches, to the mental concepts he's using while interacting with your app...
And take the UX as the overall experience of that interaction.
“Something that looks great but is difficult to use is exemplary of great UI and poor UX. While Something very usable that looks terrible is exemplary of great UX and poor UI.” (source: careerfoundry.com)
“And what is good user experience design?” you might ask yourself.
Good UX helps users do what they want to do when interacting with your business.
But measuring the success of your UX design process isn't that straightforward, though:
you need to get your target customers to... experience your app/website
then you need to keep refining it; to adjust it to the changing needs and new challenges they face, making sure it remains user-friendly over time
Now, let's see which are the 8 typical stages of a user experience design process.
Stages which might be swapped in and out, depending on your team's familiar workflow and your project's specific requirements.
Let's dive in:
Stage 1: How to Approach User Experience Design: Ground Your Work in User Research
“What is the first step of a UX design process?” you ask?
Get to know your target customers as much as possible.
What type of people will be using your app? What are their motivations, behaviors, needs, and goals?
Designed with "Make My Persona".
And having just “an idea” is not enough.
It's at this stage of the process where you gather and analyze as much data as possible on your app's target users:
run some web analytics
take user interviews
conduct online surveys
put together your user persona profile, which is no more than an archetypal representation of your target users (their goals and behaviors) that helps you validate all your future design decisions
Dive deep into all the data you've collected so far and start looking for patterns and trends.
It's these common patterns that'll help you distill this huge pile of data and see who the “average user” for your product is.
Stakeholders involved
UX design team
Deliverables:
usability studies
user personas
user stories
Stage 2: Define the Problem That the User Is Having
“What are the most important things to understand throughout a UX design process?”
The problem that you're trying to solve with your product. And why solving that problem would be beneficial to your business.
In other words, how the user’s problem aligns with your business goals.
Articulating a clear problem statement is one of the UX design process best practices.
Figure out what the user needs (or what problem he's dealing with) and plan out your product as a solution to those needs.
For example:
It's not a shopping cart that your online store's customers NEED. What they need is an overview of the items they've selected and of their total cost. The shopping cart is the solution to precisely these 2 customer needs.
Here are 4 helpful questions to focus on:
What problem do we want to solve?
What are our users' needs and why are these particular needs important to them?
Are there any existing or anticipated limitations to address?
What are the benchmarks for success?
Source: uxdesign.cc
Stakeholders involved
product manager
product design team
Deliverables:
a clear user-need statement that includes: a user, his problem or need, and his goal
storyboards
customer journey map
Stage 3: Do Some UX Competitive Analysis
Who are your competitors?
And what approaches have they adopted for their own products? How are they different/better than yours? How well do other software products, with similar features, perform?
This is that stage of the process where you run extensive research on:
your target market
your competitors
the latest UX/UI trends
Stakeholders involved
design team
Deliverables:
market research
competitor analysis
Stage 4: Sketch Out a Wireframe
Another valid answer to your dilemma — “How to approach user experience design” — is:
You put together a low-fidelity wireframe for your software product.
It'll be the link between:
your app's/website's visual design
and its information architecture
And it's also a quick and effective way to get your idea across all the teams involved.
At this stage you:
brainstorm ideas
explore possible solutions to that user's problem/need that you've identified in stage 2 (and hopefully come up with a better solution than your competition)
explore several ways of displaying different types of content and information
identify the content that you need to prioritize, according to how important it is for the user journey
No need to invest too much time (and creativity) into something too detailed.
Whiteboard photos, pencil sketches on paper will do since at this point you'll be focusing exclusively on:
the main functionality
the user experience
… on every screen
Stakeholders involved
design team
Deliverables:
user flows
hand-drawn sketches
wireframes
sitemap
lots and lots of sticky notes with ideas written on, that you can sort by hierarchy and group by theme
Stage 5: Create a Prototype
Another one of the UX design process best practices to follow.
That's because you'll want to have a draft version of your product that users could test before you do any coding.
The great thing about prototypes is that they simulate the real experience — you touch the “Next” button and it takes you to the next screen— so that testers can have a real feel of how the real app will function.
They get to experience its design in... real-time.
Stakeholders involved
design team
Deliverables:
paper prototype
design images
icons
design specifications such as colors, typography, theme, guidelines, styles
low-fidelity prototype
high-fidelity prototype
interactive prototype
Stage 6: Have It Tested by Real Users
How to approach user experience design?
You collect as much feedback as possible on your product prototype.
And here are 3 battle-tested methods:
usability testing
remote user testing
A/B testing
And you sure don't run short of means to make the most of user testing:
from simple observations
to surveys
to questionnaires
to interviews
… there are “n” ways to get your valuable feedback from real users.
Deliverables:
user feedback
usability report
analytics report
audit reports on the prototype's UI
lists of areas that need improvement (or features that should be removed/replaced)
Stage 7: Develop and Launch
Time to bring the developers in!
Now it's their time to shine. To implement the designs and:
structure the database
build the server
build the back end functionality
tie the back-end to the UI
One of the UX design process best practices to follow here is having the design team... stick around.
They might need to intervene and make small tweaks to their design or simply to communicate any issues that arise while developers are implementing it.
Stakeholders involved
development team
design team
Deliverables:
a high fidelity version of the user interface with functionality and user experience baked in
Stage 8: Evaluate
Time for a new round of... analysis.
And here are a couple of questions to guide your evaluation process:
How do users respond to our product?
Do they find it easy to use?
Where does it get it right, in terms of user experience, and where does it... fail?
Does it manage to solve their problems/meet their needs?
Stakeholders
product manager
design team
Deliverables:
new feature ideas that might need to get implemented
lists of issues reported
Final Word: The UX Design Process Comes Down to Learn.Think. Make
So, to give you a final answer to your question — “How to approach user experience design?”:
Many of the stages included in our process are debatable and perfectly... optional (i.e. you might feel like skipping the wireframing part if you have a solid design system set in place).
Feel free to swap stages in and out and to adjust the process to your own business, your teams, and your specific project requirements.
What you should not consider as optional is the 9th step in designing the user experience that I haven't included here:
The UX design process is an... ongoing one. You'll need to constantly improve and to polish your designs to fit new circumstances, new contexts, future user challenges...
No UX experts in your team to hand over all these tasks to?
We're here to help!
Just drop us a line and let's design the best user experience for your app/website.
Image by William Iven from Pixabay
Adriana Cacoveanu / Aug 24'2020