How to add a Facebook share widget to your Adalo application

Social media sharing widgets when placed strategically at various points in your application allow you to leverage your happy users as a free marketing channel for getting extra distribution. In this tutorial I’ll show you how you can embed a Facebook share widget within your Adalo application using the webview component.

This tutorial was requested as additional clarification to a brief response I made in the Adalo forums here. It’s also a feature request that has been upvoted 22 times as of this writing.

This video shows the full process start to finish:

Basically the steps are these:

  • Use the sample code from this page of documentation on the Facebook Developer portal and modify the values so they represent the page you’re intending to make sharable.
  • Put that code somewhere where it can be served publicly (either on a webserver you control or in a Amazon S3 bucket set to public).
  • Lastly, create a webview component wherever you want the share button to appear and have it call that .html file.

If you needed to make the widget reusable across multiple pages on your site you could make it a .php file instead of a .html file. This would be useful if you wanted to make it so each user of your app could share a unique tracking link or their own user profile link. The way you would do that would be to echo the REQUEST_URI variable or if you wanted to manually specify those params when calling the code via the webview component you could pass them in via the query string and have the script populate them that way.

This same technique can be used to embed sharing widgets for the other platforms. You can find docs for Twitter and LinkedIn respectively. If you’re intending to add a bunch of these buttons the easiest thing would be to create a ShareThis account, register all the services there and then just reference that in the webview component.

Let me know if you have any questions. And as always if you want a monthly summary of useful tips like these in your email inbox be sure to opt-in for my “Inbox Insights” below. cheers

3 ways to send email from Adalo using Gmail, MixPanel & ActiveCampaign

Adalo makes it easy to send in-app notifications to users but when it comes to sending emails it’s conspicuously deficient. There’s currently no way to natively send an email based on activity within the app.

I’m going to show you today three different approaches for solving this problem, all of which rely upon external systems for sending the email. We’ll look at the pro’s and con’s of each approach and then do a video tutorial that shows how to set it up in each scenario. When we’re finished you’ll have all the information necessary to pick the most appropriate method for circumstances and solve email delivery from within your Adalo app.

The pro’s and con’s of each method

While Adalo doesn’t natively have the ability to send email it does enable different approaches via middleware and its integration with MixPanel. Given the use of middleware there are infinite ways to connect to external systems but I’m going to show you three approaches using Gmail, MixPanel and ActiveCampaign for sending email. Let’s explore each one:


Using middleware like Zapier or Integromat it’s possible to invoke an external system like Gmail to send the message.
When to use this approach: If you’re just seeking to send a single email immediately to a user this is likely your best choice.
PROS: It’s free, it’s fast and it will originate from your Gmail account so it should have the same deliverability as a message you would send from Gmail.
CONS: It’s a “dumb” send in that there’s no sophistication of wait timers or conditionals and there’s no unsubscribe link so if your users decide to hit the spam button it’s going to diminish the deliverability of your main email address. You can address this by using an alias with a different sending domain but this is something you should be aware of.
How to set it up:


When to use this approach: This is a good method to use if you’re already making use of MixPanel for your app’s analytics and therefore have key events for your app defined in MixPanel.
PROS: Free up to 1000 tracked users. Their pricing here. MixPanel is a powerful tool for event-based tracking and gives you the ability to analyze funnels, do cohort analysis for retention and slice & dice on any property you’re tracking. Their customer journeys and messaging features allow you to send emails that are triggered when conditions you specify are met. You can build complex sequences that send your users relevant communications based off what they have or haven’t done in your app.
CONS: The customer journeys feature is still in beta and has some quirks to it. The way Adalo passes event data to MixPanel is unintuitive and means you need to write custom formulas to interpret the raw events and do anything useful with them. It’s a bit like sipping through a straw in that you only have access to event data tracked in MixPanel and therefore can’t use data from Adalo collections in your emails.
How to set it up:


When to use this approach: Use if you’re seeking to have an external CRM outside of Adalo tracking your users and automating communications.
PROS: ActiveCampaign is a full CRM with a powerful visual editor for building automations and workflows. Contacts can store data in tags or custom fields and this info can be used to trigger automated messaging, SMS, site messages and anything you can do with a webhook post request.
CONS: Not free. ActiveCampaign pricing here. You end up duplicating contact data outside of Adalo which can lead to data inconsistency and the overhead associated with keeping data in sync.
How to set it up:

Other considerations

We could have used the Custom Actions feature in Adalo to trigger the middleware via web hook and there can be times when that’s desirable. I chose decidedly not to use that approach in this scenario because it would yield a more brittle solution given that we sometimes manually add event attendees via the backend Adalo interface and keying off of a button press in the app would mean the emails would not send in that scenario. In general it’s a good idea to craft your solution in a way that is most resilient in the face of variance and by keying things off the Zapier “new record” trigger it becomes irrelevant how that record got there (whether it came via self-signup in the app or manually via our intervention in the admin).

I didn’t show the Sendgrid approach for sending email because it requires a $100/mo subscription to their PRO plan in order to make it work with Zapier. You could use custom actions in Adalo to call their API directly and do either a single send or initiate a full marketing campaign sequence. This would be yet a fourth way to send email from Adalo but I didn’t go down that rabbit hole for this post.


You now have three different approaches for sending email from within Adalo and can choose the most appropriate method given your circumstances. If you have any questions on the techniques shown above please leave a comment below. If you’d like to receive an occasional email from me teaching methods like these sign up for my email list below. cheers

A 5-step universal framework for better outsourcing

You’re handling a bunch of tasks that you know you should be offloading to a virtual assistant. This daily operational muck will monopolize your time and keep you mired in place until you figure out how to extricate yourself. Welcome to operational quicksand.

Photo credit Wikimedia Commons

You may already know you need to delegate and may have even already attempted to do so through outsourcing but had a bad experience. Or maybe it’s something you’ve put off attempting because you dwell on the number of ways it could go wrong:

  • What if you get a bad apple worker and they screw things up?
  • What if you find a great worker but it turns out that training and supporting that person takes up as much time as executing the tasks yourself?
  • What if you find that unicorn perfect assistant, you’re able to efficiently train the person but then he/she leaves after you’ve invested all that time and you then have to start from scratch?

These are all valid concerns.

The good news is there’s a repeatable playbook you can use to reliably build up a bullpen of low-cost, high-skill outsourced talent that will permanently free you from the operational muck. Forever. And it’s a method you can use regardless of what industry you’re in or what role you’re hiring for.

Before we get there though, let’s first look at how the traditional approach to outsourcing typically goes wrong.

How outsourcing typically fails

The problem with the traditional approach to outsourcing is it’s not a system. This is one of my favorite quotes:

“If you can’t describe what you are doing as a process, you don’t know what you’re doing.” – Edwards Deming.

If you’ve tried and failed with outsourcing before chances are your experience went something roughly like this:

  • You had a specific job you needed done and went to a service like Fiverr or Upwork.
  • You posted a job and got a bajillion applications.
  • Applicant quality was all over the map but you settled on the one that seemingly sounded like the best fit from the heresay of his/her cover letter and skill set.
  • You awarded that person the job.
  • And you got back a result that missed the mark, possibly in a huge way. Maybe communication was difficult or they went dark indefinitely or they just didn’t truly understand the goal of the project and fundamentally botched the outcome.
  • You closed your laptop lid in disgust and wrote off outsourcing as a waste of time and went back to doing all the muck work yourself.

If your experience approximated this trajectory you’re not alone. Sadly this dysfunctional scenario plays out daily on these outsourcing sites despite all the ratings and reviews and technological checks & balances that exist. You know why? Because no amount of technology will solve a problem that’s happening on a different axis. The fundamental failing here comes down to this:

You bet on hope as a strategy instead of betting on a system.

Hope is not a reliable strategy. A system is.

My hero Jermaine Griggs has a brilliant saying: “A SYSTEM is Something You Stick To Emphatically and Methodically.”

Note nowhere does that definition say anything about technology because a system does not equal technology. It can incorporate technology but a system is just the deterministic playbook you execute that ensures you have a process to get you reliably closer to your goal.

A system makes it so you don’t have to bet on hope anymore.

I’m going to now show you the system I use for recruiting, vetting and working with outsourced labor. This methodology works regardless whether you’re outsourcing website development, podcast production, graphic design, lead generation, or baking cakes. It’s axiomatic and predicated on three different patterns that I call the “horse race,” “airlocks” and “fail canary” patterns.

How it works

The gist of this method is to remove the guesswork from recruiting outsourced labor and make it a data-driven game. You will be setting up essentially a mini “horse race” with multiple candidates that will ultimately reveal who your winning horse is empirically. Note: when I refer to “horses” in this context I’m purely using this tangible analogy to drive home the crux of the technique and not seeking to dehumanize outsourced labor nor imply they’re like horses.

Photo credit Pixabay

The “Horse Race” is the controlled experiment which gives you apples-to-apples comparison of potential candidates in a real-world scenario.

“Airlocks” is the method by which you partition and parallelize the work amongst the horses in the race.

And “Fail Canary” is the technique you use to screen out candidates up front who can’t follow instructions.

So without further ado, here are the five steps and how these patterns work together:

  1. PREPARE: Develop a challenge that will test the primary skills you’re hiring for. If you’re hiring a full-stack web developer to build custom functionality for your WordPress site you could enumerate a set of features, sketch up a few screens and talk through it in a video. If you’re hiring a graphic designer to spruce up your site you can craft a redesign project with the goals and constraints defining desired styles, exemplary sites, etc. The point is to create a project that captures a good cross section of the work they will be doing with you over time and that won’t be solvable in two hours but can reveal meaningful progress in that time.
  2. RECRUIT: Create an account on a service like Upwork and post the job requirements. I’m a huge fan of using Trello and filming a Loom video walkthrough for this part (here are a few examples from a couple past mini projects). This is where I typically include a “Fail Canary” to screen out candidates who are incapable of following instructions. In the video up front I tell them I’m running a screening test to hire 1-2 contract workers who will be on retainer long-term with me and will be paid their full hourly rate for their participation in this preliminary screening test. I tell them they need to watch the full video explanation of the project and follow all instructions in order to qualify. Then at the end of the video when I’m done explaining the project requirements I ask them to parrot back their understanding of the project, how they propose to solve it and ask for an extra random bit of information like “what is your favorite food?” Failure to provide an answer to this “fail canary” question disqualifies them from consideration. While that might sound harsh this is your first filtration mechanism for screening down your pool of applicants to those who can follow instructions.

    You can further screen using proxy requirements. Here’s what I mean by that: you may be hiring for a PHP dev role but what are the adjacent skill sets which identify a truly progressive dev who is on top of his/her game, well-rounded and focused on continuous learning? For this scenario I’ll further constrain my pool of applicants by including a tangential skill set like “Angular JS” “Node JS” or “Laravel” because finding the intersection of those two skill sets tells me this is a person who is at the forefront of his/her craft pushing the boundaries and learning complimentary frameworks that separate him/her from the pack.

    Your job now is to canvas the available pool of potential hires and invite the most desirable candidates to fill your recruiting funnel. Your only goal at this stage is to get job applications from qualified candidates who demonstrate they understand the job and at least seem competent in their proposed approach for solving the challenge. Systems like Upwork enable you to search available candidates based on defined skills and quickly invite them to your position. You can copy/paste your invite or personalize it depending on how your funnel for qualified applicants is looking. If your invites are getting declined more often then not, consider taking a few extra seconds to personalize them.

  3. SCREEN: You should now have a pool of qualified candidates and your job from here is to winnow down to the 4-5 ones you think are best. Hopefully they’ve all submitted a cover letter fulfilling your request to summarize their understanding of the project, their proposed approach for addressing the challenges and their fail canary response. And ideally they’ve sent you a video instead of a cover letter. A video can reveal a lot about communication and personality style. You should have at least 10 qualified applicants at this stage. If not, keep recruiting until you do.

    Once you have your 10 applicants evaluate them on the info you have at hand, namely their job application and their past track record of job completion and comments from previous clients. You’re now going to invite the most desirable horses to your horse race and equate the track on time or money so it’s a level, objective playing field. You want to award this project to 4-5 candidates and ask them to complete a fixed chunk of work towards solving it. I like to hire people for 2hrs at their full hourly rate. Alternatively you could pay each for $50 worth of work and let them work however long that gets you as a function of their hourly rate. The key here is to have a common fixed-length racetrack for the horse race so there can be a clear winner. I find it works best to fix on an allotted time block and just pay the different hourly rates. You will be admittedly paying 5x for the same piece of work in this mini-project but you will be gaining an invaluable apples-to-apples comparison of real-world work experience in the process that will help you definitively pick your winning horse tomorrow and avoid weeks of working with the wrong candidate.

    Once you’ve awarded the jobs to your applicants it’s horse race time! Aaaaaand they’re off….

  4. EVALUATE: Depending on the complexity of the role, the job and what you’re testing for you may want to invite each candidate to use whatever project management infrastructure you usually use. The more you can test the candidates in a real-world scenario of how they’ll actually be working with you, the better. I like to invite my applicants as single-channel guests in a Slack channel setup for the project. Encourage questions if anything is unclear. Gauge their performance on the dimensions you care about: how responsive are they? What is the quality of their communication? Are they big-picture-focused and goal oriented or following a spec with blinders on with no eye towards the end goal? If you’re testing collaboration, are they cooperating with other candidates in Slack? How is the quality of the final work product? Did they come back with proposed improvements that indicated they thought deeply about the problem and found a better solution? If so, congrats you’ve found a gem.
  5. AWARD: So who was your winner? Typically the performance graph you see looks something like this:

    Photo credit Pixabay

    You’ll have one that did pretty well, two who gave a very lukewarm performance, one who was running perpendicular to the race track and one who nailed it. Double-down on that lead horse. If you lucked out and had two who nailed it this is how you build a bull-pen of fallbacks and/or scale to parallelize work and have multiple workers going simultaneously. Don’t burn bridges at this point. Respectfully report the results to everyone who won’t be hired back and congratulate your lead horse on crushing it. Open a standing contract with that person and at this point you almost certainly want them as a single-channel Slack guest and in whatever other project management systems you use. I recommend paying slightly over their full hourly rate so that if they get busy they prioritize your jobs. Paying $1/hr extra is peanuts to you but could be a 5% pay increase for them. Also, take time to get to know your contractors, their family situation, what they like to do, when their holidays are. I guarantee 90% of his/her clients don’t do that so this is yet another opportunity to strengthen the relationship at no additional cost and this rapport can prove invaluable later when inevitable misunderstandings arise.

The role of “Airlocks”

We didn’t talk about the “Airlocks” pattern and what that is so let me briefly explain. Airlocks is a term I use for compartmentalizing and ensuring an air gap to your production system so that you can have a safe sandbox for untrusted labor to work without exposing you to security risk.

Photo credit Wallpaperflare

This is situation-specific to your circumstances vs. a blanket one-size-fits-all recommendation but let me give you some examples:

  • If you’re hiring for WordPress development, clone the site and create a separate site sandbox for each developer.
  • If you’re hiring a VA to produce your podcast, create a dummy account for each worker in whatever system you’re using (ie.
  • If you’re hiring a graphic designer, give them read-only access to the media assets in Gdrive or Dropbox and give them a private write-enabled sub-folder just for them to save their work product.

As you identify winning horses over time you will obviously need to open the kimono to various systems and grant access. I’ve become a huge fan of the open source team password sharing system Passbolt. There’s a Digital Ocean droplet for it and for $6/mo you can get a really elegant system for granting and revoking access to your key systems with tiered trust levels. Very useful. Obviously change your passwords when you let people go just as you would with a traditional full-time employee.


There’s one last thing we need to talk about: what happens if/when you lose your lead horse? Turnover is a reality with any form of employment and people move on for a variety of reasons. One of the beautiful features of this approach to hiring is it’s particularly resilient in the face of turnover- I would even argue it’s anti-fragile in that the system actually becomes stronger in the face of turnover.

This is my actual documentation for my VA Marko from Macedonia who handles the production of The Nomad Podcast. Marko is amazing and for $50/episode he takes 6hrs of production work off my plate. We have a great relationship but if Marko won the lottery tomorrow I’m guessing he would move on and cease producing my podcast. What then?

The elegance of this approach is that I still have all the scaffolding that I created to recruit and train Marko, the original job posting with the screening challenge, the documentation above and all the Slack history of answering his questions. If I had to find another Marko at this point, the playbook is already written and just needs to be re-run. That’s leverage, that’s efficiency and ultimately that’s peace of mind.


We’ve covered a lot of ground here: the why for outsourcing, the ways it goes off the rails, a bulletproof system for reliably getting and working with the best talent. Once you have the outsourcing superpower you begin to win back your time, escape the operational quick sand and conquer increasingly difficult challenges with less stress because now not only do you have a solution but rather a system that solves. Yay. Proper use of outsourcing is a massive strategic advantage for you and having a bulletproof method for consistently finding the best talent faster than others puts you at an advantage amongst this advantaged subset. Remember if you can’t describe what you’re doing as a process…

If you enjoyed this post join my email list for exclusive tutorials on how to increase your leverage. Happy outsourcing.

Lateral thinking and “Flintstoning” your way around technical problems

Sometimes the best solution to a problem is to step around it.

When was the last time you butted your head against a technical challenge and had several failed attempts to solve it? Maybe it was due to limitations of the platform you’re using or limitations of your own technical ability. Or maybe it was just a really freakin’ hard problem to solve that is solvable via technical means but not ultimately worth the energy for doing so.

Sometimes the best solution isn’t to “beat the problem” so much as to side-step it with a human-powered solution. I’m going to show you a technique for doing this called “Flintstoning” and give you some guidelines for how to identify situations where a low-tech Flintstoned solution might make more sense than tackling the problem head-on.

What is Flintstoning?

Flintstoning is using human power under the hood to solve what would traditionally be a software-based problem. I first heard this term back in 2006 via Cambrian House. It’s typically used in the context of doing things in a decidedly-manual way early on in a startup for the sake of learning a process inside & out before you try to automate it. But it’s valuable in other contexts such as in the case where you have a particularly elusive technical challenge that meets a certain set of criteria.

When does it make sense to Flintstone?

If you can answer yes to these five questions it’s likely that your problem is a good candidate for a Flintstoning-based solution:

  1. problem is particularly “fuzzy”
  2. a human can do the task cheaply
  3. easy to expose an interface
  4. costs of solving via software-powered outweigh value of problem
  5. does not need to be solved in real-time

Let me give you a concrete example of a good Flintstoning solution candidate from a comment on one of my recent YouTube videos:

This guy Tapan is asking if it would be possible to use my hack with browser-based automation for essentially doing periodic garbage collection clearing out unused photos in his database after a certain time period.

Browser-automation really isn’t the right tool for this. He needs the equivalent of a cron process that runs in Adalo and handles this but Adalo currently has no concept of time-based system generated tasks so he’s scratching his head trying to figure out how to automate this garbage collection process.

Rather than engineering a technical solution I suggested he just hire a virtual assistant (VA) to log into his app weekly and clean out the unused images in the database. Given how Adalo works with the ability for two apps to share the same database it’s trivial for him to create a special admin interface for his VA with heavily-restricted permissions that enables that person to handle this without creating any real security risk. With maybe two hours of work between recruiting and tasking the VA and writing a quick visual interface his garbage collection problem is solved with no more head butting. He’ll pay a few dollars each week in VA fees but has saved would could be a couple thousand dollars in dev work and has the problem handled immediately so it’s a massive win.

Considerations and tools

Obviously not every problem lends itself to being solved in this way but by going through your feature backlog and analyzing what’s on your plate dev-wise using the above five questions, you may find you can knock out a bunch of features using this technique in short order.

I have a few VA’s from Upwork on retainer in Slack with standing open hourly contracts and for situations like this I can simply record a Loom video and task them in situations like these. This works well for situations when there’s a bit of context required to understand and complete the task and it’s low-priority and infrequent work that’s required.

For situations where the work is more mindless, 24/7 and needs to scale beyond what one person can handle Amazon offers a service called Mechanical Turk to programmatically task humans with small jobs called HITs (human intelligence tasks). It’s basically like a realtime eBay of grunt work in which you’re farming out this labor via microtransactions of a few pennies from within your app. That’s a topic for another post but a powerful tool to have in your arsenal.


Next time you find yourself going down a rabbit hole of failed technical attempts at solving a problem, use the questions above to determine whether your problem is a good candidate for a Flntstone solution. It’s a win all around with you getting a cheaper/faster/resilient solution in place while also employing someone who is happy to have the work.

In a future post I’ll deconstruct the two main underlying principles of this technique of Flintstoning which are two design patterns I use called “Inversion of Control” and “Airlocks.” I’ll show you how those are like lego blocks that can be used in conjunction with a third I call the “Horserace” pattern to solve hard problems creatively. Be sure to join my email list if you want exclusive content like this around automation, leverage and lateral thinking in your inbox. cheers

UPDATE 6/10/20: This post got some traction on Hacker News yesterday and a few people pointed out in the comments that there is already another name coined for this technique: The Wizard of Oz Paradigm. Name it whatever you like. The important takeaway is that this technique of software-invoked human intervention is a powerful fudge factor to use in your apps that can give you a superpower for solving a class of problems that would otherwise require unjustifiable time & dev resources to solve.

How to save time & frustration by automating repetitive browser-based tasks

Today we’re going to look at how to automate hours of mindless busywork using a free open source piece of software called “Katalon Studio.”

The specific challenge we’re automating is the bulk deletion of records in an Adalo collection. Currently the Adalo tool (as amazing as it is) offers no way to wipe all the records in a collection. Currently your only options are:

  1. Drop and recreate the collection, which then means you have to re-establish all the relational connections to other collections not to mention rewire all the data in the screens that reference that collection.
  2. Go through one by one and delete each record individually.

No bueno either way.

I talked to one gentleman in the Adalo forums who had this issue and he had 5k records to delete.

Unfortunately he tackled it the manual way before I had the chance to document this method. Guess how long that took him?

That’s four hours of mind-numbing work. Computers are meant to work for us, not the other way around. We can do better.

I’m going to show you now a superpower in how you can take a four-hour task like this one, automate it once and solve it forever. So let’s get started.

Browser automation with Katalon Studio

Katalon is an open source piece of unit testing software based on the Selenium project. It’s entirely free to use. It’s typically a tool for QA testing in software applications that allows you to run a set of unit tests on an Android or web application. We’re not going to use it as a testing tool though. We’re just using it to perform the busywork we don’t want to do here.

The easiest way to tinker with Katalon is to get the Katalon Chrome Extension and play with it in your browser.
We need the looping capability which is only present in the desktop version so you’ll need to download and install that before you go on.

Showing it in action

First check out how the end result works in this video:

That’s four hours of your time you win back not to mention in the process you acquire a new superpower which can save you from future scenarios like this…

This video shows you the steps necessary to build the script I used in the above video:

The basic procedural steps here are:

  1. Record the initial automation.
  2. Fix anything that needs to be parameterized as a variable.
  3. Loop just the repetitive portion so you’re not wasting time on unnecessary steps.
  4. Execute the script and go do something fun while your computer is working for you 😉

As I mentioned in the video there are other further optimizations that could be made to the script to make it even more dynamic, like setting the number of loop iterations based on figuring out the record count of the items in the db… but, diminishing returns.

Additional resources and ideas

If you happen to have this exact scenario and just want to delete a bunch of records in Adalo, I put the Katalon Studio deletion script in Github. You can just download it and change the start URL to your Adalo collection and update it with your username/password and it should work without any other modification assuming nothing changes in the Adalo interface between now and then.

And that brings up a good point about this tactic: it’s incredibly powerful to be able to automate anything you could do in a browser but unlike API’s, user interfaces are prone to changing. If Adalo changes anything about how their user interface works it will likely require updating the script to work. It’s somewhat resillient because it uses Xpath and regular expressions for finding elements on the page but this this is something to be aware of about this approach is that it’s inherently brittle based on UI.

The best resource I found for learning the basics of Katalon was this free Udemy course. One of the great things is that there are a ton of people on Upwork who know how to write browser automation scripts so if you don’t have the time or ability to generate this (and you’re comfortable giving access to whatever system you’re using to an outsider) you can hire a freelance engineer from Upwork to write the script for you. Win-win, they make a few bucks and you save a few hours…

I’ll write up in another post the process I use delegating something like this to Upwork. That’s a whole topic unto itself but even that can be automated 😉

I hope this technique saves you time and frustration and frees you up to do something else productive. If you want to receive more awesomeness like this from me be sure to join my email list below. Happy automating.

How to create a star ratings component in Adalo

If you’re building an app in Adalo and seeking to give your users the ability to leave star ratings, it can be confusing because there are infinite ways to skin that cat. How do you handle displaying the star review? Do you modify a numeric field in the listing table? If so how do you track new reviews and prevent gaming of the system by users repeatedly reviewing listings?

I’m going to show you a simple technique for how to accomplish all this and in the process teach some lessons around visibility rules, custom formulas and a key principle of database design.

Questions on how to do this come up quite a bit in the Adalo Forums and it’s one of the more requested components in their feature request system. The technique I’m about to show you is what I used in building a kiva clone for us at Charity Makeover to add progress meter functionality for donations.

In this video I’m going to demonstrate from scratch how to build a simple wine listing directory app with a 5-star review component.

The first video sets everything up from scratch to the point of being able to review the wine:

And this second video shows how to display the star ratings and rating count:

That is the 80/20 of how you do it. Something I forgot to show in the video is you’ll want to use the Round() function in the custom formula for the magic text that generates the star graphic. As it stands now if I were to add one more rating that made the review average something like 3.33333333 it would break the graphic. But to prevent that scenario you just do this:

Leave a comment if you have a question about anything in the videos and if you enjoyed this tutorial you’ll love getting my emails. Sign up below.

Improving the first-time user experience in your Adalo app with smart visual onboarding prompts

Getting your users over the “suck threshold” sooner

You’ve worked hard to build a great app and have done a bunch of work to promote it. You’re getting signups but too many of your new users are fizzling out and leaving before they get their first win in your application. Kathy Sierra calls this getting over the suck threshold:

Image credit Kathy Sierra

You need to improve your first-time user experience but how do you do that? How do you help your users get over the suck threshold faster?

If your app is built in Adalo you can easily create a custom walkthrough overlay that hand-holds your new users through the steps necessary to get them their first win. This overlay will conditionally display custom visual cues to your users in sequence until they take the necessary actions that get them to the point where they’ve accomplished something that makes them want to come back.

What’s different about this approach

You’ve undoubtedly experienced one of those visual walkthroughs when first logging into a new software application.

It likely took the form of a tour that explained the gist of how to get started and maybe it was even interactive, but chances are it was a canned, one-time, linear sequence – essentially a slide show. The technique I’m about to teach you is better because instead of being a one-time canned tour, it’s a smart, persistent set of visual cues that handhold the users through a series of steps until they achieve their first win.

Why this matters

What is the impact of getting more of your users past the suck threshold early on? Well for starters:

  1. More engagement means less churn/attrition and a wider funnel.
  2. Every dollar you spend on advertising or hour you spend on organic traffic promotion yields more return.
  3. New user satisfaction improves and consequently…
  4. Referral rates on your application go up because your users are delighted with the experience.

Boom! For a few minutes of work this technique pays dividends indefinitely unkinking the hose with your new signups. So let’s dig into the nitty gritty of how it works.

How it works

The video below shows you first the front-end experience as a new user so you can see how it works:

And this video shows you the back-end of how to create this experience in Adalo using layers of elements with nested visibility rules:

Pretty cool, right? Try it out with your own app and see what it does to your new user engagement. Post any questions on this technique in a comment below.

This is my first post. I’m trying an experiment for the next month documenting a bunch of useful insights I’ve gleaned from having worked with various nocode tools and platforms for the past few years. If you want to get juicy tips like this one join my list below. And if you found value in this the greatest compliment you can pay is that of a referral or a social share. cheers