Upgrade to Pro — share decks privately, control downloads, hide ads and more …

From Bird to Elephant: Starting a New Journey on Mastodon

From Bird to Elephant: Starting a New Journey on Mastodon

With the recent turmoil at Twitter, like many others, I’ve been wondering about migrating my social presence to Mastodon. But it’s a brand new world I know nothing about! So how does one get started on Mastodon? Which instance should I choose? What’s the netiquette there? What are the faux-pas to avoid? Should I cross-post to both networks? Who to follow, and how to gain followers? In this presentation, we’ll talk about the journey from the bird’s feathers to the elephant tusks, share some tips and tricks, to get the best of this new experience.

In this presentation, we’ll talk about this migration, we’ll share tips and tricks to get the best experience on Mastodon. Furthermore, we’ll have a look under the hood, to better understand how the “fediverse” operates, and particularly at the underlying protocols, including ActivityPub/ActivityStream and WebFinger.

Guillaume Laforge

April 13, 2023
Tweet

More Decks by Guillaume Laforge

Other Decks in Technology

Transcript

  1. De l’oiseau bleu à l’éléphant
    La transition vers Mastodon
    Guillaume Laforge
    Developer Advocate
    Google Cloud
    @[email protected]

    View Slide

  2. Part 1
    Mastodon
    & Twitter

    View Slide

  3. What is
    Mastodon?

    View Slide

  4. joinmastodon.org

    View Slide

  5. Welcome to
    the Fediverse!
    fediverse.party

    View Slide

  6. View Slide

  7. What is Mastodon?
    How different is it from Twitter?
    A network of
    federated
    servers

    View Slide

  8. What is Mastodon?
    How different is it from Twitter?
    A network of
    federated
    servers
    Open source
    and open
    protocols

    View Slide

  9. What is Mastodon?
    How different is it from Twitter?
    A network of
    federated
    servers
    Open source
    and open
    protocols
    Not owned by
    a single
    company

    View Slide

  10. What’s the experience like?
    Mooaarrr
    characters!
    You can edit
    your posts!

    View Slide

  11. What’s the experience like?
    Mooaarrr
    characters!
    You can edit
    your posts!
    Chronological order
    No algorithm for
    your timeline

    View Slide

  12. What’s the experience like?
    Mooaarrr
    characters!
    You can edit
    your posts!
    Chronological order
    No algorithm for
    your timeline
    No search!
    (just #hashtags)
    No ads!

    View Slide

  13. What’s the experience like?
    Mooaarrr
    characters!
    You can edit
    your posts!
    Chronological order
    No algorithm for
    your timeline
    No search!
    (just #hashtags)
    No ads!
    Privacy: fine grained
    controls
    Content warnings

    View Slide

  14. Getting
    started

    View Slide

  15. Choose a server that resembles you!
    Pick up a region, a topic, a language.
    Change your mind? You can migrate
    to a new server and not lose your
    followers & following.
    JoinMastodon.org

    View Slide

  16. Use the web frontend of your
    server on your computer.
    On mobile:
    ● Tusky on Android
    ● Metatext on iOS
    Pick up a client

    View Slide

  17. Tips &
    tricks

    View Slide

  18. Increase your chances to be followed
    back, by completing your profile to
    make it more meaningful, more you!
    Would you follow this one?
    Create your profile
    before following
    anyone

    View Slide

  19. Your first “toot” should be your
    introduction. Tell everyone who you
    are, and use the #introduction
    hashtag.
    Be sure to pin that introduction toot
    to the top of your timeline.
    Introduce
    yourself!

    View Slide

  20. Extra step for discoverability, check the
    box to suggest your account to
    others, via “trends” and other
    features.
    Suggest
    your account
    to others

    View Slide

  21. Double check that the “opt-out of
    search engine indexing” checkbox is
    unchecked, which would make your
    account not findable easily.
    Don’t opt out of
    search engine
    indexing

    View Slide

  22. No need to pay a subscription
    to be officially verified.
    Add a tag
    in the pages mentioned in your profile
    metadata links.
    Verify
    yourself

    View Slide

  23. The elephant bird
    in the room

    View Slide

  24. You’re not alone migrating to
    Mastodon. Check if the people you
    followed on Twitter are also on
    Mastodon.
    Find your Twitter
    friends on Mastodon
    ● twitodon.com
    ● movetodon.org
    ● fedifinder.glitch.me

    View Slide

  25. Put your Mastodon link in your Twitter bio.
    Your Twitter handle might be taken by
    someone else impersonating you 30 days
    after you’ve relinquished your account.
    If you really quit, request your Twitter
    archive, for posterity.
    Don’t delete your
    Twitter account (yet?)

    View Slide

  26. Moa.party is a tool you can use to
    cross-post on Twitter and Mastodon.
    Cross-posting is frowned upon though.
    Avoid automated
    cross-posting

    View Slide

  27. Keep accessibility
    in mind

    View Slide

  28. Use #CamelCase for your #HashTags.
    Screen readers will appreciate!
    Use hashtags liberally, to participate
    in the conversations on that topic.
    CamelCase
    HashTags

    View Slide

  29. When sharing pictures in your toots,
    be sure to specify an “alt” tag,
    so that screen readers can read the
    description.
    Use “Alt” tags
    for your images

    View Slide

  30. Be mindful and hide content that may
    affect others behind “content
    warnings” (politics, adult, violence,
    mental health, food…)
    A label is visible, click on “show more”
    to read the rest. Same for pictures,
    click on “sensitive content” to make it
    appear.
    Content
    Warning

    View Slide

  31. Going
    further

    View Slide

  32. A treasure trove of tips about
    Mastodon & the Fediverse
    Follow @[email protected]
    Fedi.Tips

    View Slide

  33. Running an instance isn’t free.
    If you can, help sustain your instance
    administrators by funding it.
    You can also support the Mastodon
    developers via Patreon.
    Help sustain
    your instance

    View Slide

  34. Part 2
    The APIs &
    Standards

    View Slide

  35. ● ActivityPub — W3C protocol based on
    ActivityStream, and JSON-LD
    ● WebFinger — RFC to resolve links to resources
    ● MicroFormats — open CSS based format to
    embed metadata in HTML
    ● Security — HTTP signatures and OAuth 2
    The importance
    of standards

    View Slide

  36. How to implement a basic ActivityPub server?
    blog.joinmastodon.org/2018/06/
    how-to-implement-a-basic-activitypub-server/
    {
    "@context": [
    "https://www.w3.org/ns/activitystreams",
    "https://w3id.org/security/v1"
    ],
    "id": "https://my-example.com/actor",
    "type": "Person",
    "preferredUsername": "alice",
    "inbox": "https://my-example.com/inbox",
    "publicKey": {
    "id": "https://my-example.com/actor#main-key",
    "owner": "https://my-example.com/actor",
    "publicKeyPem": "-----BEGIN PUBLIC KEY-----..."
    }
    }
    JSON-LD syntax
    ActivityStream
    vocabulary
    A “person” actor
    An “inbox” to
    receive messages
    Asymmetric key cryptography,
    to sign your messages
    The “Actor”

    View Slide

  37. How to implement a basic ActivityPub server?
    blog.joinmastodon.org/2018/06/
    how-to-implement-a-basic-activitypub-server/
    {
    "subject": "acct:[email protected]",
    "links": [
    {
    "rel": "self",
    "type": "application/activity+json",
    "href": "https://my-example.com/actor"
    }
    ]
    }
    /.well-known/webfinger?resource=acct:[email protected]
    Alice’s account
    ActivityStream
    vocabulary
    URL to our
    actor definition
    WebFinger to link an account
    resource to the actor’s URL

    View Slide

  38. How to implement a basic ActivityPub server?
    blog.joinmastodon.org/2018/06/
    how-to-implement-a-basic-activitypub-server/
    {
    "@context": "https://www.w3.org/ns/activitystreams",
    "id": "https://my-example.com/hello-world",
    "type": "Create",
    "actor": "https://my-example.com/actor",
    "object": {
    "id": "https://my-example.com/hello-world",
    "type": "Note",
    "published": "2023-04-12T10:08:46Z",
    "attributedTo": "https://my-example.com/actor",
    "inReplyTo": "https://my-example/@bob/100254678717223630",
    "content": "Hello world",
    "to": "https://www.w3.org/ns/activitystreams#Public"
    }
    }
    The message: a “note”
    creation activity
    JSON-LD syntax &
    ActivityStream vocabulary
    Actor’s URL
    Note creation
    Can reply to
    another message
    Lightweight HTML with
    Microformat classes

    View Slide

  39. How to implement a basic ActivityPub server?
    blog.joinmastodon.org/2018/06/
    how-to-implement-a-basic-activitypub-server/
    POST /users/bob/inbox HTTP/1.1
    HOST: my-example.com
    Date: 12 Apr 2023 10:08:46 GMT
    Digest: e37e179c75071a291f90a5fd4f848da87b491f1282f7bb8509ef2115b81ee0f4
    Signature: keyId="https://my-example.com/actor#main-key",headers="(request-target) host date
    digest",signature="Y2FiYW...IxNGRiZDk4ZA=="
    Content-Type: application/ld+json; profile="http://www.w3.org/ns/activitystreams"
    Cryptographically signed
    the message payload
    RSA-SHA256 digest hash
    of the message body
    (request-target): get /users/bob/outbox
    host: my-example.com
    date: 12 Apr 2023 10:08:46 GMT
    RSA-SHA256 digest
    hash of those headers
    Same set of headers

    View Slide

  40. Part 3
    Time for
    Demos!

    View Slide

  41. Unlike Twitter, no way to know
    how many views your “toots”
    got.
    Let’s calculate your
    maximum potential reach,
    with the following formula:
    No analytics! potential_reach =
    me.followers +
    ∑ boosters
    i
    .followers
    n
    i=1

    View Slide

  42. Get Your Reach!
    stootistics.web.app

    View Slide

  43. There’s even a bot!
    @[email protected]

    View Slide

  44. Vue.js for the frontend
    with Shoelace web components
    Java & Micronaut
    for the server backend
    Hosted on Google Cloud Run
    Firebase hosting for the nice URL
    Cloud Scheduler for scheduling
    Vue.js + Micronaut

    View Slide

  45. Vue.js for the frontend
    with Shoelace web components
    Java & Micronaut
    for the server backend
    Hosted on Google Cloud Run
    Firebase hosting for the nice URL
    Cloud Scheduler for scheduling
    Vue.js + Micronaut

    View Slide

  46. Vue.js for the frontend
    with Shoelace web components
    Java & Micronaut
    for the server backend
    Hosted on Google Cloud Run
    Firebase hosting for the nice URL
    Cloud Scheduler for scheduling
    Vue.js + Micronaut

    View Slide

  47. Vue.js for the frontend
    with Shoelace web components
    Java & Micronaut
    for the server backend
    Hosted on Google Cloud Run
    Firebase hosting for the nice URL
    Cloud Scheduler for scheduling
    Vue.js + Micronaut

    View Slide

  48. DEMO
    Guillaume Laforge
    Developer Advocate
    Google Cloud
    @[email protected]

    View Slide

  49. Thank You
    Guillaume Laforge
    Developer Advocate
    Google Cloud
    @[email protected]

    View Slide