Achievements system

Hiya guys, I’m in the beginning phases of implementing an Achievements system and wanted to know if something like this is possible with the Avatar List?

I would like to have dimmed icons until the achievement is met, but I need a nudge in the right direction with ‘achieving’ this :wink:

Any help would be awesome thx!

There’s actually several different ways to accomplish this, with the easiest being to use the Custom List, but if you’re set on using the Avatar list for the horizontal scroll functionality, it will prove much more complex and require some interesting record and collection customization that I would need to work out myself. The Custom List is by far much easier to do than the Avatar List, but let me work up an example for you to clone. Give me a sec.

2 Likes

great i needed this :blush: :blush: :blush:

Here’s a cloneable app that shows a very basic system for doing this with the Avatar list complete with badges and updating images upon completion: Achievements Tracker Template

This approach makes use of several hacks such as the Countdown batch update, the Image appending URL parameters (duotone in this case), and the onboarding screenflow.

Amazing thank you! I would indeed love the Horizontal scroll functionality based on the design space needed.

Looking forward to your example, appreciate it!

Wow that was fast, really appreciate this as it’ll add some needed retention to my app! Will dissect this today for sure.

Thx!

1 Like

No problem! Let me know if you have any questions.

1 Like

When you have a moment, how would update without clicking a button? Would I need something like an invisible text input that waits for a condition to be met then fire off the url call? :thinking:

Or maybe I can be sneaky and add a full screen modal?

Oh, performant wise in the Achievement Copies collection, you have individual entries per user, is this better in the long run? Or having Multiple Users to 1 Achievement is good as well?

Thx!

For this you would still need the User Achievement Copy’s as a list to you can update the “Current User Achievement Copy” You can really make anything a list so it doesn’t have to be a button, but the user will need to take an action of some kind still. Usually you can make this work better by having a congrats screen or something that they have to confirm. Another option is to use a modal screen to display a Lottie file that is actually a list and will update automatically once the animation has played.

This actually will not work because if you update the achievement to completed, it will make it complete for all users.

1 Like

Gotcha! ANd of course, that makes perfect sense regarding the collection :slight_smile:

I also have an issue where the Image Url doesn’t display in the list, even directly copying the url you used.

And you’re correct! This is much more complex :frowning:
thx!

This is because the image URL stays the same for all achievements and the User Achievements Copies are what should be displayed. You’ll notice that the URL for those is set to be the Achievements URL, but with &duotone=000000,ffffff appended to the end of it to make it greyed out. Once the user completes it, the URL is updated to the original Achievement Image URL. In this screenshot, remove the &duotone=000000,ffffff from the URL and it should work for you.

1 Like

Looks like I got it going! Not sure what I changed but maybe it was reassigning them.

I think the only thing needed now is some form of Global Variable or Conditional check. I’m more versed in Game Development in this regard, :slight_smile: so I’m thinking something like;

If Achievement is True
then link to Modal

Then once the user clicks ok/close it will flip the icon. Know what I mean?

You can set actions per screen, so I guess I can go that route using the visibility check?

I think that would work just fine! As long as there is some sort of conditional visibility or action you should be able to control the user flow.

1 Like

Gave me a good idea with the countdown timer. I’m using an invisible countdown to do the check. Thx so much for all your help on this. Looks like it’s all working.

Hiya @pford quick question, for onboarding, any suggestions to quickly update existing users? I have roughly 40 signed on already. :grimacing:

Hiya, out of curiosity, how would you do it with a custom list? I’m thinking of scalability as I will eventually add more as I go.

Cheers!

Quick update, I love Adalo, got the existing users onboarded using your countdown solution but changed it to “Current User” Was able to do them all in 5mins :slight_smile:

All looks solid now! We should make this a clonable kit for the front page!

Cheers!

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.