72 lines
5.3 KiB
HTML
72 lines
5.3 KiB
HTML
<!Doctype HTML>
|
|
<head>
|
|
<title>Patchwork Invite</title>
|
|
<link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/source-code-pro" type="text/css"/>
|
|
<link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/fantasque-sans-mono" type="text/css"/>
|
|
<link rel="stylesheet" href="stylesheet.css" title="Stylesheet" type="text/css" media="screen" charset="utf-8">
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<img src="https://solarpunk.cool/images/invite-letterhead.jpg" class="logo">
|
|
<div>
|
|
<h2>Hi, {recipient}!</h2>
|
|
<h2> Come talk to me on Scuttlebutt! It's a decentralized social network with a radically different experience from Facebook or Twitter. It's unique, supportive, cool, and reminds me of what the web must have felt like at the very beginning.</h2>
|
|
<h2>Because it's so radically different (like, it's not actually <em>on the web</em>) it takes a few steps to get started, which i've helpfully included below!</h2>
|
|
<h2 class="steps-title">How to Join Scuttlebutt, and How to Find Me on The Network:</h2>
|
|
<ol>
|
|
<li class="steps">Download Patchwork, a client for navigating Scuttlebutt.</li>
|
|
<p>Scuttlebutt is a <em>method</em> for decentralized communication, but there are different clients to choose from for navigating this scuttleverse(sort of like choosing between chrome and firefox for the web). Patchwork is my preferred client, and you can download it below:</p>
|
|
<div class="link-box">
|
|
<div class="link-button"><a href="http://dinosaur.is/patchwork-downloader/" target="_blank" >Download Patchwork</a></div>
|
|
<p class="caption">(opens in new window)</p>
|
|
</div>
|
|
<li class="steps">Install and start up The Patchwork application.</li>
|
|
<img class="gif" src="https://solarpunk.cool/images/installing-patchwork.gif">
|
|
|
|
<li class="steps">Paste in a pub invite code.</li>
|
|
<p>Pubs are like happy, always-on robot friends that are great at relaying messages for us. The pub helps us talk to one another when we're not on the same local network.</p>
|
|
<p><em>You can find me on this pub: <span class="accent-text">{pub}</span></em></p>
|
|
<p><<em>And you can join by clicking 'join pub' and pasting in this invite code:</em></p>
|
|
<p><strong class="invite-code accent-text">{invite-code}</strong></p>
|
|
<img class="gif" src="https://solarpunk.cool/images/pub-invite.gif">
|
|
<li class="steps">Hang out for a sec as you are synced up with the network.</li>
|
|
<img class="gif" src="https://solarpunk.cool/images/download.gif" style="max-width: 800px; margin-top: 30px;">
|
|
|
|
<p>With Scuttlebutt, you own and hold your own data, which is your social network. But this means that when you first join the pub, all the messages in your network are downloaded to your computer. This keeps the entire network decentralized and not reliant on any server (unlike facebook or twitter). It also means you can browse the entire network while being offline!</p>
|
|
<p>Since it's made up of mostly text, the network will take up about 500mb on yr computer, and the downloading should take less than 5 minutes.</p>
|
|
<p>While you wait, check out this video that better explains how Scuttlebutt works, through the context of a <span class="accent-text">*~*~</span>love story<span class="accent-text">*~*~</span>:</p>
|
|
<div class="link-box">
|
|
<div class="link-button"><a href="https://vimeo.com/236358264" target="_blank">Scuttlebutt: a Love Story</a></div>
|
|
<p class="caption">(opens in new window)</p>
|
|
</div>
|
|
<li class="steps">Find Me and Friend Me.</li>
|
|
<p>My name on here is <span class="accent-text">{username}.</span></p>
|
|
<p>But you should find me using my public key, which is:</p>
|
|
<p class="invite-code accent-text">{public-key}</p>
|
|
<p>The public key is sort of like my techno-signature, so you know that the person you are friending is actually me.</p>
|
|
<p>You can find me by pasting my public key into the search bar. This'll bring you to my profile, where you can follow me.</p>
|
|
<img class="gif" src="https://solarpunk.cool/images/search-for-me.gif">
|
|
<li class="steps">Say Hi!</li>
|
|
<p>You can write either public or private messages. The private ones are end-to-end encrypted, meaning it's impossible for anyone who isn't me to read them.</p>
|
|
</br>
|
|
<p class="caption">To send me a private message, click private, then add my @name and say hi!</p>
|
|
<img class="gif closer" src="https://solarpunk.cool/images/writing-private-message.gif">
|
|
<p class="caption">To send a public message, either just post in the public thread (and maybe @mention me) or post in the #new-people channel (which is what I'd recommend)</p>
|
|
<img class="gif closer" src="https://solarpunk.cool/images/writing-public-message.gif">
|
|
|
|
<li class="steps">Check out these other channels.</li>
|
|
<p>There's a lot of good conversations happening on this network. Here are three channels I think you'd like. Just paste them into patchwork's search bar to check them out!</p>
|
|
<ul class="accent-text" style="line-height: 1.6em;">
|
|
<li>{channel-one}</li>
|
|
<li>{channel-two}</li>
|
|
<li>{channel-three}</li>
|
|
</ul>
|
|
</ol>
|
|
<div class="closing-remarks">
|
|
<p> I'm excited to talk to you through Scuttlebutt! Let me know if you have any problems starting up!</p>
|
|
<h2><em> - {sender}</em></h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|