DEV Community: Jordan

Diversifying Emojis With AI

Jordan — Fri, 26 Jul 2024 21:53:06 +0000

I've been advising GFXvs.com, a daily AI art battle with on-chain rewards. Sharing the daily battle across social media required some clever design. After several iterations the team landed on "spinners":

This design met the requirements of incorporating both images, but also established an unmistakably branded asset for people to collect. The motion catches eyes on social platforms but makes it difficult to say if your daily vote is going to the left or right image. The answer was to watermark the two contestants with emoji, which also brought a more playful feeling to the collectables and voting.

With all of the hard problems out of the way, it was time to indulgently bike-shed something that didn't really need fixing: how can we ensure the emojis appearing on the artworks are not only interesting, but also diverse? While I joke that it's not important, little details like this are what can make or break a series of digital collectables.

For the sake of numerology we decided to select 420 of the most popular and coded emoji from the current set of 3,782. By narrowing things down we had the freedom to pick and choose to meet our diversity requirements: an even spread of colors and categories.

Our first pass at the emoji dataset was something like this:

var emojis =  {
    "1": {
        "emoji": "🤣"
    },
    "2": {
        "emoji": "❤️"
    },
...
}

Effective, but it didn't give us enough to work with. So we summoned the Cursor AI to tear through and update our data to look more like this:

        "6": {
            "emoji": "😇",
            "name": "Smiling Face with Halo",
            "category": "Smileys & Emotion",
            "unicode": "U+1F607",
            "color": "yellow"
        },

Not perfect, but better than going through 420 emojis by hand! To help with the final sorting and selection, Cursor AI provided a python script that would console log the emojis by color and category, for easier sorting:

import json

# Load the JSON data from file with utf-8 encoding
with open('emojis.json', 'r', encoding='utf-8') as file:
    data = json.load(file)

# Dictionaries to count emojis of each color and category, and store the emojis
color_emojis = {}
category_emojis = {}
seen_emojis = set()
special_unicode_emojis = []
replacement_char_emojis = []

# Iterate through each emoji entry
for key, emoji_info in data['emojis'].items():
    emoji = emoji_info.get('emoji')
    unicode_repr = emoji_info.get('unicode', 'unknown')
    color = emoji_info.get('color', 'unknown')
    category = emoji_info.get('category', 'unknown')
    name = emoji_info.get('name', 'unknown')

    # Check for duplicates
    if emoji in seen_emojis:
        print(f"Duplicate emoji found: {emoji} (ID: {key})")
    else:
        seen_emojis.add(emoji)

    # Check for special Unicode characters
    if '2640' in unicode_repr or '2642' in unicode_repr:  # Unicode for ♀️ and ♂️ respectively
        special_unicode_emojis.append((emoji, unicode_repr))

    # Check for replacement character
    if '�' in emoji:
        replacement_char_emojis.append((emoji, name))

    # Collect emojis for each color
    if color in color_emojis:
        color_emojis[color].append(emoji)
    else:
        color_emojis[color] = [emoji]

    # Collect emojis for each category
    if category in category_emojis:
        category_emojis[category].append(emoji)
    else:
        category_emojis[category] = [emoji]

# Sort and print the emojis for each color and category
print("Counts by Color:")
for color, emojis in sorted(color_emojis.items(), key=lambda item: len(item[1]), reverse=True):
    print(f"{color}: {len(emojis)} {' '.join(emojis)}")

print("\nCounts by Category:")
for category, emojis in sorted(category_emojis.items(), key=lambda item: len(item[1]), reverse=True):
    print(f"{category}: {len(emojis)} {' '.join(emojis)}")

# Print special Unicode emojis
if special_unicode_emojis:
    print("\nSpecial Unicode Emojis:")
    for emoji, unicode_repr in special_unicode_emojis:
        print(f"{emoji} with Unicode {unicode_repr}")

# Print emojis that resulted in the replacement character
if replacement_char_emojis:
    print("\nEmojis resulting in Replacement Character:")
    for emoji, name in replacement_char_emojis:
        print(f"{emoji} - {name}")

The output allowed us to quickly iterate on the curation process, turning our previously jumbled emojis with duplicates and so on into something that soothed our detail oriented souls:

This diversity maximizes the interesting outcomes from creating the daily battle spinners. If you like AI artwork come join the fun at GFXvs.com. Spinners are minted as NFTs every day you vote, and one lucky winner gets the unique rare NFT of the day!

Snap, Mint, Engage: Building Your Own Web3 Photo Booth with Minsta 📸

Jordan — Wed, 27 Mar 2024 01:00:18 +0000

Imagine an app that empowers people to capture life's special moments and mint them as NFTs with just a snap - no blockchain experience required. That's the magic of Minsta, an open source photo minting dapp powered by Mintbase.

With Minsta, you can create a custom branded experience for any event or community, letting users snap photos and share meaningful memories on-chain in seconds. From conferences to cultural festivals, Minsta lets you gamify and tokenize participation in a way that's fun and accessible to everyone.

To engage users, Minsta features customizable leaderboards that rank participants by total mints. You can also define raffle prizes that are awarded to the top minters and randomly-selected participants. Devs can easily tweak the thresholds and rewards to craft a super engaging experience.

Deploying your own Minsta instance is a breeze too. The repo is designed to be easily forked and customized by developers, so you can have your own personalized version up and running in no time.

Some inspiring examples of Minsta in action:

Rakhi India - Special NFTs for the cherished festival of Raksha Bandhan
NEARCon - Collectible moments from NEAR's annual gathering
NEAR APAC - Celebrating an Unlimited Future in Vietnam
ETHDenver - Minting memories at the world's largest Web3 #BUIDLathon

Ready to deploy your own custom Minsta and start capturing memories on-chain? Let's dive in and see how it's done!

Walkthrough

At its core, Minsta is a slick React app that interacts with several key Web3 technologies to enable seamless, decentralized photo minting. Here's a quick overview of the main components:

NEAR Wallet Integration: Minsta leverages Mintbase Wallet, a non-custodial, meta transaction-based wallet built on the NEAR protocol. This allows for gasless onboarding and a silky-smooth UX. New users can create an account and start minting in seconds, no crypto or coding skills required.
Minting via Proxy Contract: To enable permissionless minting, Minsta uses a proxy minter contract deployed by Mintbase. This contract is authorized as a minter on your NFT contract, so any Minsta user can mint without needing their own minter permissions. Super clean and decentralized.
Arweave Storage: When a user snaps a photo, it's uploaded to the Arweave decentralized storage network and the metadata is saved immutably on-chain. This ensures photos remain accessible forever, with no central point of failure.
AI-Powered Metadata: Optionally, you can use the Replicate API to analyze uploaded images and automatically generate titles and descriptions for the NFT metadata. A nifty way to streamline the minting flow and add some AI magic.

Under the hood, the app is built with battle-tested tools like Next.js, TypeScript, and Tailwind CSS, making it a breeze to customize and extend. The repo is designed to be hacker-friendly, with detailed docs and inline comments to help you grok the codebase quickly.

Setup

Ready to deploy your own custom version of Minsta? Let's walk through it step-by-step:

Fork the Repo

Head over to the Minsta repo on GitHub and smash that "Deploy" button to create your own copy of the codebase.

Deploy a Mintbase Contract

If it's your first time deploying a smart contract you may want to switch over to testnet (3) so you can get the hang of things without paying any fees.

Log in to your Mintbase profile and deploy a new contract (1, 2) or choose an existing one. This will be the NFT contract that your Minsta instance mints to.

Grab the contract address, you'll need it later.

Add a Proxy Minter

In your Mintbase contract settings, navigate to the "Minters" tab and add the 0.drop.proxy.mintbase.near contract as a new minter. This lets your Minsta app mint on behalf of users.

Set Up Environment Variables

If you used the "Deploy" button you can jump right into configuration. Otherwise, clone your forked repo and create a .env file in the root directory.

Here you'll define config options like your app name, NFT contract address, network (mainnet/testnet), and more. Check .env.example for a full list of available env vars.

Customize Your App

Time to make it yours! Update the app name, colors, logo and other UI elements by tweaking the env vars and code. Maybe add some custom leaderboard logic or new share hooks. Go wild!

Deploy Your Changes

If you used the "Deploy" button then all you need to do is "Redeploy" in Vercel. Otherwise, create a new project in Vercel, connect your forked repo, and hit deploy. In a few short minutes, your custom Minsta will be live on the interwebs!

Next Steps

Congrats, you've got a shiny new Minsta app that's ready to be customized and extended in all sorts of fun ways! Here are a few ideas to get your gears turning:

Custom Leaderboard Logic: Tweak the leaderboard rules and rewards to fit your specific use case. Maybe top minters get a special NFT badge, or unlock tiered rewards based on their rank. The possibilities are endless!
Social Sharing Hooks: Make it easy for users to share their freshly-minted photos on Twitter, Discord, or other social platforms. You could even generate custom share images with the user's photo and stats overlaid.
Themed Challenges: Spice up the minting experience with daily or weekly photo challenges. Prompt users to snap pics around a certain theme, and reward bonus points for the most creative entries.
AR Face Filters: Tap into the power of AR by integrating face filters or effects that users can apply to their photos before minting. Maybe even tie the filters to specific NFTs or achievements!
Decentralized Judging: Let the community vote on their favorite mints, and use quadratic voting or other sybil-resistant mechanisms to determine the winners. Power to the people!
Physical Rewards: Bridge the digital and physical realms by offering exclusive merch or other IRL rewards to your top minters. Stickers, enamel pins, you name it!

The beauty of Minsta being open source is that you have the freedom to remix and extend it in whatever wild directions you can imagine. So don't be afraid to experiment, iterate, and put your own unique spin on it.

If you build something rad with Minsta, we'd love to see it! Share your creations with us on Twitter or hop in our Discord to geek out with other builders. And if you have any questions or feedback along the way, don't hesitate to open an issue on the repo.

Happy building, and happy minting! 🚀

The Hidden Connect: Accounts, Wallets, and Credentials in Crypto

Jordan — Sun, 28 Jan 2024 22:52:29 +0000

Read the entire article to receive your Proof of Learning!

Today is Just OK

Have you ever logged into a website without thinking much about it? Maybe you used G••gle or Faceb••k to sign in, or perhaps you entered a simple email address and password, sometimes even the same password you use everywhere. But what if there was a safer, easier way?

Introducing a Better Way

There is! By using Mintbase Wallet for user login in your app, you're tapping into webauthn technology. This tech uses things like fingerprints to confirm a user's identity, offering a secure and even smoother experience than the usual login methods we see today.

Understanding the Basics

Let's break down the basics: Credentials, Accounts, and Wallets. While these are important for us to understand, your regular users don't need to worry too much about them.

Credentials

Credentials can be anything used to prove who you are. Remember those old video game codes you had to write down? Those were a type of credential. These days, we usually use usernames and passwords for everything from online banking to casual browsing.

In systems like two-factor authentication, each 'factor' is a separate credential. In blockchain systems, where there's no 'undo' button, using multiple credentials (multi-factor authentication) is vital for keeping your assets safe.

Sometimes, you can use multiple credentials for one account. For example, access to a specific email or phone number can be a credential to reset your password.

Accounts

An account is the information a service keeps about you. Think of your progress in a game, your posts on social media, or your bank balance. Credentials let you access your account, but they are not the account itself.

Wallets: Linking Credentials and Accoutns

In the web2 world, a popular system is oauth, which lets you log into smaller websites using credentials from bigger sites. While convenient, it has its drawbacks, like less privacy.

Web3 brings a more secure and convenient solution with the webauthn standard. Developers can add a wallet selector to their sites, allowing users to log in using their own securely stored credentials. This method is safer and easier than using passwords.

A wallet is software that helps users manage their secure credentials, making it easier and safer to access accounts.

Try It Out

Now that you understand the theory, why not experience it for yourself? Use this link to create an account with Mintbase Wallet. You'll use the biometric vault on your device as credentials. As a bonus, you'll get an NFT to celebrate learning and reading this far. Then try Adding Wallet Connect to Your React App!

Collect Your Proof of Learning

Which Chain Abstraction Track Will You Hack To Win Over $15,000 in Prizes?

Jordan — Thu, 11 Jan 2024 07:49:33 +0000

January is the month to hack account and chain abstraction at Abstracting.org! With 7 tracks dishing out 15k+ in prizes there's tons of opportunity to explore. Get inspired with demos, hands on at workshops, and support at office hours throughout the month.

Chain abstraction breaks down barriers between different blockchain networks for seamless interoperability. Meanwhile, account abstraction reimagines user experiences, offering a more intuitive and flexible way to manage digital identities and assets.

For some abstraction examples; imagine defi protocols unlocking liquidity and opportunities across chains 💦 smoother onboarding than web2 with better security than oauth 🔏 or funding trial accounts that can only interact with your dApp 🤯

Web3 natives are already familiar with the hassle of hopping networks for scalability and juggling multiple accounts for security. Abstraction offers a convenient alternative where you can access all of your assets at once, without the hassle of bridging.

If it's your first time hearing terms like sub accounts, delegate actions, and meta transactions; they enable tangible experiences like digital loyalty programs 🎫 commerce at festivals with bad internet 🎉 and programable time shares 😎

Near Protocol enables all this abstraction with a flexible account model, allowing for granular access control. Every account is it's own smart contract and every contract is an account. It's possible to specify account level access to any function call... Including the ability to add and remove seed phrases for full access to an account, making it possible to securely trade an entire portfolio!

Hyped?! Hit Abstracting.org for more about abstracting with Near Protocol, event registration, and hack ideas from sponsors like Mintbase, Potlock, and Keypom. There's a GPT agent stuffed with relevant tech docs and telegram chat where you can form teams with 400+ builders.

Mastering Bounty Creation for NearCon on Heroes.build

Jordan — Sun, 05 Nov 2023 08:51:10 +0000

Delegating tasks can be tough, but it's essential to scale success. NearCon '23 will host more than 3000 builders in Lisbon, ready to take on new challenges. You can reach out to this eager pool of talent by posting work bounties on HEROES.BUILD. This guide will show you how to do it quickly and effectively, even if you are very busy.

HEROES streamlines your bounty experience with a secure, transparent platform for task-based payments, featuring smart escrow transactions, straightforward invoicing, and optional identity verification for worry-free tax compliance. Let's dig in!

Sign In, Set Up

You can create an account using email or log in directly using GitHub.

After you're in, connect the wallet you'll use to fund bounties.

Once your wallet connects it's time to create a bounty! On mobile it's in the hamburger menu.

Description

Apply the NEARCON2023 tag so that your bounty will get a special call out on heroes. You can add as many tags as you like.

Type of "Other" and Experience of "Any" are fine unless you see a type that describes your bounty better than the tags.

Details

Submit as an individual because DAO functionality is coming soon™️.

When it comes to successful delegation, accurately describing the work and expectations are the absolute number one key for success.

Boot up your favorite LLM and start bouncing things off it to generate a comprehensive description of the work. Markdown is allowable so you can make headers for the Background, Objectives, Deliverables, Criteria, and Worker Requirements. GPT/Claude/Bard can probably write a snappy title for you too! Here's an example prompt to get you started:

I need to write up a bounty so I can delegate a task to a gig worker. It's important for the request to be really clear and easy for an international audience to read and understand. If you can help with that give me a 👍 and I'll describe the work.

Acceptance criteria is a sentence describing the point of handoff. For example, link to published work, GitHub repo, gDrive link with sharing enabled, etc.

Provide a full URL to your telegram, twitter, etc to make it easy on the hunters trying to contact you outside of the messaging built into HEROES.

Duration

For flexibility I suggest leaving Duration/Deadline alone & just hit next.

Payment

To foster trust HEROES will escrow the funds you are committing to for the bounty.

If you want to fund bounties with a token we're missing, please get in touch.

Pop open advanced settings and check invoicing to get your paper trail (thank is later).

Advanced Settings

You made it this far which is totally advanced! Multitasking and Application Restrictions are worth digging into. Before that let's review the lifecycle of a bounty on HEROES. Funder actions above the dots, hunter actions under the dots. By default, once delegation happens other hunters are blocked from starting any work (like if an RFP has been rewarded).

Multitasking

Contest/Hackathon applies to the delegate step. It allows multiple hunters to begin work at the same time, even if there will be only one of them which is paid out in the end.

One For All is for tasks you want multiple hunters to claim and submit, with each of the hunters earning the same amount when their work is verified.

Different Tasks splits a bounty up so that multiple team members can work together towards the same goal. Each subtask can earn a different amount when the work is verified.

Application Restrictions

Manual Approval is the default. No hunters can begin work until you approve a claim proposal.

Whitelist allows you to specify wallets that are allowed to propose claims. For example, you could snapshot NFT holders and only allow them to make claims.

Whitelist Auto allows anyone in your list to begin and submit work without you manually approving their claim proposal. This is useful if a hackathon bounty is being rewarded to a specific team after judging has occured. Another use case is efficiently delegating to trusted teammates.

Auto Approval skips the claim and delegate steps entirely, allowing a free for all of work to be submitted for verification. If you're running a One For All bounty this can cut your clicks in half.

Review & Publish

That's it! If everything looks good you can publish your bounty!

After you publish you can see your bounty in the feed.

Click on the bounty card to get a deep link to the bounty so you can share it to your community.

You'll also get the bonus eyeballs of everyone hacking at Nearcon in Lisbon or Virtually.

Accepting Claim Proposals

You'll get an email notification when Hunters have applied to claim your bounty. When you're back in HEROES head to "your bounties."

After you click into the relevant bounty head to the Applicants tab so you can approve or reject claim proposals.

Accepting the claim will start the time commitment countdown (the hunter is required to provide an estimate if you don't specify any time constraints).

Verifying Submitted Work

When a hunter has completed and submitted their work you'll get another notification to verify that it meets your requirements.

Inside the bounty it will be marked as completed to indicate your approving the work rather than a claim. The chat will include any final details from the hunter for your review.

After your approval funds will be released from escrow to the hunter, mission accomplished!

Any Questions?

Shoot a comment below or hop on telegram to chat with the HEROES community!

Unlock the Future of Web3: Explore Digital Assets on NEAR's Eco-Friendly Blockchain with Mintbase JS API & Win $500!

Jordan — Tue, 26 Sep 2023 00:40:03 +0000

Right now I'm running a contest where developers of any skill level get entries into a $1,000 prize pool by completing a quick tutorial, check it out!

Wondering why I'm so passionate about Mintbase? Let me guide you through 🧵👇

𝐀 𝐉𝐨𝐮𝐫𝐧𝐞𝐲 𝐑𝐨𝐨𝐭𝐞𝐝 𝐢𝐧 𝐀𝐫𝐭

It began with a dream of bringing artists to the blockchain when we lost IRL earning opportunities. In 2020, together with curator Lisa Kolb, we showcased artists at the CODAME ART+TECH Festival through JOYNT. Success tasted sweet on ETH, but the challenging UX and environmental concerns made us seek alternatives.

𝐃𝐢𝐬𝐜𝐨𝐯𝐞𝐫𝐢𝐧𝐠 𝐌𝐢𝐧𝐭𝐛𝐚𝐬𝐞 𝐚𝐧𝐝 𝐍𝐄𝐀𝐑

That's when Mintbase, developing on the carbon-neutral L1 NEAR, caught our eye. I was immediately drawn to NEAR's open engineering culture and Mintbase’s Createbase community. This community, brimming with diverse minds and genuine intent, laid the foundation for the current CreativesDao.

𝐖𝐡𝐲 𝐌𝐢𝐧𝐭𝐛𝐚𝐬𝐞 𝐒𝐭𝐚𝐧𝐝𝐬 𝐎𝐮𝐭

Through the turbulence of web3, Mintbase remained a beacon of integrity and innovation. Their approach is refreshingly honest – no token launches, no shady activities, just a commitment to universal standards and interoperability. Their real USP? Launch a contract with Mintbase, and you're the owner, staying true to web3's spirit of radical self-reliance.

𝐍𝐄𝐀𝐑'𝐬 𝐆𝐚𝐦𝐞-𝐂𝐡𝐚𝐧𝐠𝐢𝐧𝐠 𝐀𝐩𝐩𝐫𝐨𝐚𝐜𝐡

Parallelly, Near Protocol has etched its own niche, driving blockchain adoption to unprecedented heights. It powers giants like Sweatcoin and Cosmose (KAIKAI), placing it among the top 5 chains by user activity. With native stable coins, NEAR ensures seamless transactions on Mintbase, supplemented by credit card payments. Near Foundation’s thoughtful strides have ensured its legal robustness and a healthy treasury. Its experimental projects, like the Near Digital Collective and Blockchain Operating System, showcase its dynamism.

𝐖𝐞𝐛𝟑: 𝐀 𝐃𝐨𝐦𝐚𝐢𝐧 𝐨𝐟 𝐄𝐧𝐝𝐥𝐞𝐬𝐬 𝐏𝐨𝐬𝐬𝐢𝐛𝐢𝐥𝐢𝐭𝐢𝐞𝐬

With economic uncertainties looming, developers are scouting for fresh horizons. While the bear market paints a grim picture of crypto, the surge in blockchain developer demand (552% in 2022) is hard to ignore. So, why wait? Dive into the $1000 Mintbase challenge!

Don't consider yourself a developer? No worries! Try tasks like creating a testnet wallet or crafting a Mintbase AffiliateDirect link. There's a challenge for everyone to tackle 🤝

Unlock Digital Collectables Using Mintbase JS

Jordan — Tue, 19 Sep 2023 21:59:33 +0000

The Mintbase API empowers web developers to integrate digital collectibles into their toolkit. By the end of this tutorial, you'll have a fully configured environment ready for diving deeper into web3 with a powerful JavaScript API.

Even if you're just starting out with JavaScript, you'll find this guide easy to follow. This is your gateway to the web3 industry that witnessed a staggering 552% growth in developer demand in 2022!

Plus, if you complete the tutorial by October 11th, 2023, you'll have a chance to win a share of the $1,000 prize pool!

Near Protocol

Mintbase makes it easy to interact with the NEAR blockchain using Javascript. Why NEAR? Because It's carbon-neutral and has bullet proof scalability that's trusted by giants like KAI-CHING (the #1 dApp in the world) and SweatCoin (gamified exercise since 2015). With a commitment to great experiences for both developers and end users, NEAR is easy for anyone to pick up.

Grabbing a NEAR account via shard.dog link is a perfect demonstration of the seamless onboarding process. Especially worth checking if you're participating in the contest as you'll need a NEAR name to claim prizes.

You'll also need to create a testnet account to follow along with the tutorial. Each testnet account comes with a bunch of tokens for experimenting and development. If you run out of testnet tokens you can always make another account!

Mintbase on Testnet

Now that you have a Testnet account you can easily create your own Mintbase contract. On the top right of the site be sure you're logged in and that you've selected NEAR TESTNET.

After confirming you're on Testnet head to Manage -> My Contracts and then use the New Contract button. You can fill in the Store Name/Symbol with anything and proceed to paying the contract storage fee.

What's a storage fee? Instead of monthly payments to a hosting provider you make a one time payment to the Near network to keep your contract forever. 100kb costs ~1 NEAR token, which we're not too worried about with our play tokens on testnet.

Next head over to Build -> Developer API to get your your Mintbase Testnet Developer Key. Use the Generate New Key button and Copy it for safe keeping. Normally you wouldn't share that key with anyone, but if you're participating in the contest you can paste it on gleam for an entry.

Forking a Marketplace

Now that your store contract exists on the blockchain it's possible to use any interface to interact with it, thanks to the power of decentralization. However, most business clients will want a dedicated store with customized branding.

An example marketplace repository demonstrates how you can use Mintbase JS to integrate web3 collectables into any front end you're familiar with. To clone and deploy the repository with Vercel go under Build -> Deploy a Marketplace on the testnet Mintbase.xyz site.

Once you get to the Vercel page you'll need to specify a git host. This is where your fork will live so that you have a copy and can edit it.

After connecting your git host the Mintbase simple-marketplace repository will clone and you'll get a progress indicator of how the deployment is going. It should take less than 5 minutes for the entire process to run.

Configure Your Marketplace

The last step is configuring the cloned marketplace to connect with the contract you created earlier. Follow the Simple Marketplace README.md to rename the .env.example file and update the variables.

If you forked the marketplace using Github you can edit directly on their website (as pictured). Otherwise clone the repo to your computer and edit it there.

Submit your marketplace URL and the updated .env variables to the gleam contest for another two entries!

Next Steps

Follow Mintbase on Twitter to find out about upcoming opportunities to earn like the grants program and hackathons! How cool would it be to see a FOREM listing extension leveraging Mintbase JS?

If you have any questions as you continue to explore, pop into the Telegram chat for timely responses.

For my next article I'm planning to cover the Meritocracy Wordpress Plugin, subscribe so you don't miss it!