eibhearPublic/blueskyArchitecture
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Additional slides.

Browse source
This commit is contained in:
Éibhear Ó hAnluain 2024-05-20 12:25:54 +01:00
parent 00cf8686ed
commit fea208f397
Signed by: eibhear
GPG key ID: D124FE9CF2177106
3 changed files with 250 additions and 78 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

227
BlueskyArchitecture.html
View file

@ -27,17 +27,17 @@
<h2>Table of Contents</h2>
<div id="text-table-of-contents" role="doc-toc">
<ul>
<li><a href="#/slide-org2d545f3">Introduction</a></li>
<li><a href="#/slide-org1010f01">General social media architectures</a></li>
<li><a href="#/slide-org003a8ec">Federated social media services</a></li>
<li><a href="#/slide-orgc2daf2a">Introduction</a></li>
<li><a href="#/slide-orgad38665">General social media architectures</a></li>
<li><a href="#/slide-org7a00c66">Federated social media services</a></li>
</ul>
</div>
</div>
</section>
<section>
<section id="slide-org2d545f3" data-background="./bCardBackground.png">
<h2 id="org2d545f3">Introduction</h2>
<section id="slide-orgc2daf2a" data-background="./bCardBackground.png">
<h2 id="orgc2daf2a">Introduction</h2>
<div class="e-frame">
<p>
Boo!
@ -46,153 +46,248 @@ Boo!
</section>
</section>
<section>
<section id="slide-org1010f01" data-background="./bCardBackground.png">
<h2 id="org1010f01">General social media architectures</h2>
<div class="outline-text-2" id="text-org1010f01">
<section id="slide-orgad38665" data-background="./bCardBackground.png">
<h2 id="orgad38665">General social media architectures</h2>
<div class="outline-text-2" id="text-orgad38665">
</div>
</section>
<section id="slide-org89686e0" data-background="./bCardBackground.png">
<h3 id="org89686e0">Simplistic view 1/2 &#x2013; overview</h3>
<section id="slide-org3cd6edb" data-background="./bCardBackground.png">
<h3 id="org3cd6edb">Simplistic view 1/2 &#x2013; overview</h3>
<div class="e-frame">
<div id="orgb6005a1" class="figure">
<div id="org87909da" class="figure">
<p><img src="structurizr-1-001-GenericSocial-01.png" alt="structurizr-1-001-GenericSocial-01.png" width="90%" />
</p>
</div>
</div>
</section>
<section id="slide-orgf2ed27f" data-background="./bCardBackground.png">
<h3 id="orgf2ed27f">Simplistic view 2/2 &#x2013; services</h3>
<div class="e-frame">
<section id="slide-org90a0f8b" data-background="./bCardBackground.png">
<h3 id="org90a0f8b">Simplistic view 2/2 &#x2013; services</h3>
<div class="gridded_frame_with_columns e-frame">
<div id="org15115b0" class="figure">
<p><img src="structurizr-1-002-GenericSocial-02.png" alt="structurizr-1-002-GenericSocial-02.png" width="20%" />
<div class="one_of_2_columns">
<div id="org497fd94" class="figure">
<p><img src="structurizr-1-002-GenericSocial-02.png" alt="structurizr-1-002-GenericSocial-02.png" width="40%" />
</p>
</div>
</div>
<div class="one_of_2_columns">
<ul>
<li class="fragment appear">Social media user access the app</li>
<li class="fragment appear">The app interacts with the API</li>
<li class="fragment appear">The API is the gateway for the database of posts, responses, likes, etc.</li>
</ul>
</div>
</div>
</section>
<section id="slide-org410f558" data-background="./bCardBackground.png">
<h3 id="org410f558">More realistic view 1/4 &#x2013; overview</h3>
<section id="slide-org5586a4a" data-background="./bCardBackground.png">
<h3 id="org5586a4a">More realistic view 1/4 &#x2013; overview</h3>
<div class="e-frame">
<div id="org6f55442" class="figure">
<div id="org758ce44" class="figure">
<p><img src="structurizr-1-003-RealisticSocial-01.png" alt="structurizr-1-003-RealisticSocial-01.png" width="90%" />
</p>
</div>
</div>
</section>
<section id="slide-org9dadd8a" data-background="./bCardBackground.png">
<h3 id="org9dadd8a">More realistic view 2/4 &#x2013; basic services</h3>
<div class="e-frame">
<section id="slide-orgd055aae" data-background="./bCardBackground.png">
<h3 id="orgd055aae">More realistic view 2/4 &#x2013; basic services</h3>
<div class="gridded_frame_with_columns e-frame">
<div id="orgdb2b082" class="figure">
<p><img src="structurizr-1-004-RealisticSocial-02.png" alt="structurizr-1-004-RealisticSocial-02.png" width="40%" />
<div class="one_of_2_columns">
<div id="org587691a" class="figure">
<p><img src="structurizr-1-004-RealisticSocial-02.png" alt="structurizr-1-004-RealisticSocial-02.png" width="70%" />
</p>
</div>
</div>
<div class="one_of_2_columns">
<ul>
<li class="fragment appear">Social media user access the app</li>
<li class="fragment appear">The app interacts with the API</li>
<li class="fragment appear">The API is the gateway for the database of posts, responses, likes, etc.</li>
<li class="fragment appear">The API also captures data for building profiles of users for targeting purposes</li>
<li class="fragment appear">The algorithmic feed generator guides the API on what posts to place into the app's feed</li>
</ul>
</div>
</div>
</section>
<section id="slide-org3ac93ef" data-background="./bCardBackground.png">
<h3 id="org3ac93ef">More realistic view 3/4 &#x2013; the algorithm</h3>
<div class="e-frame">
<section id="slide-org8512e36" data-background="./bCardBackground.png">
<h3 id="org8512e36">More realistic view 3/4 &#x2013; the algorithm</h3>
<div class="gridded_frame_with_columns e-frame">
<div id="org7365515" class="figure">
<p><img src="structurizr-1-005-RealisticSocial-03.png" alt="structurizr-1-005-RealisticSocial-03.png" width="40%" />
<div class="one_of_2_columns">
<div id="orga2950d5" class="figure">
<p><img src="structurizr-1-005-RealisticSocial-03.png" alt="structurizr-1-005-RealisticSocial-03.png" width="70%" />
</p>
</div>
</div>
<div class="one_of_2_columns">
<ul>
<li>Social media user access the app</li>
<li>The app interacts with the API</li>
<li>The API is the gateway for the database of posts, responses, likes, etc.</li>
<li>The API also captures data for building profiles of users for targeting purposes</li>
<li>The algorithmic feed generator guides the API on what posts to place into the app's feed</li>
<li>Algorithmic feeds are created by the service administrator, using an app only <i>they</i> have access to</li>
</ul>
</div>
</div>
</section>
<section id="slide-org522a4e7" data-background="./bCardBackground.png">
<h3 id="org522a4e7">More realistic view 4/4 &#x2013; content moderation</h3>
<div class="e-frame">
<section id="slide-orgb69029c" data-background="./bCardBackground.png">
<h3 id="orgb69029c">More realistic view 4/4 &#x2013; content moderation</h3>
<div class="gridded_frame_with_columns e-frame">
<div id="orgbcb5188" class="figure">
<p><img src="structurizr-1-006-RealisticSocial-04.png" alt="structurizr-1-006-RealisticSocial-04.png" width="60%" />
<div class="one_of_2_columns">
<div id="org0c68d2d" class="figure">
<p><img src="structurizr-1-006-RealisticSocial-04.png" alt="structurizr-1-006-RealisticSocial-04.png" width="100%" />
</p>
</div>
</div>
<div class="one_of_2_columns">
<ul>
<li>Social media user access the app</li>
<li>The app interacts with the API</li>
<li>The API is the gateway for the database of posts, responses, likes, etc.</li>
<li>The API also captures data for building profiles of users for targeting purposes</li>
<li>The algorithmic feed generator guides the API on what posts to place into the app's feed</li>
<li>Algorithmic feeds are created by the service administrator, using an app only <i>they</i> have access to</li>
<li>Moderation is also performed by a member of the service's staff, using a dedicate app and services the the user doesn't have access to</li>
</ul>
</div>
</div>
</section>
</section>
<section>
<section id="slide-org003a8ec" data-background="./bCardBackground.png">
<h2 id="org003a8ec">Federated social media services</h2>
<div class="outline-text-2" id="text-org003a8ec">
<section id="slide-org7a00c66" data-background="./bCardBackground.png">
<h2 id="org7a00c66">Federated social media services</h2>
<div class="outline-text-2" id="text-org7a00c66">
</div>
</section>
<section id="slide-org890aad6" data-background="./bCardBackground.png">
<h3 id="org890aad6">Federated services 1/8 &#x2013; overview</h3>
<section id="slide-orgbb7c31a" data-background="./bCardBackground.png">
<h3 id="orgbb7c31a">Federated services 1/8 &#x2013; overview</h3>
<div class="e-frame">
<div id="org7500818" class="figure">
<div id="orgc103a20" class="figure">
<p><img src="structurizr-1-007-FederatedSocial-01.png" alt="structurizr-1-007-FederatedSocial-01.png" width="75%" />
</p>
</div>
</div>
</section>
<section id="slide-org1ef0297" data-background="./bCardBackground.png">
<h3 id="org1ef0297">Federated services 2/8 &#x2013; internal, administration and content moderation services</h3>
<div class="e-frame">
<section id="slide-orge5fe0ce" data-background="./bCardBackground.png">
<h3 id="orge5fe0ce">Federated services 2/8 &#x2013; internal, administration and content moderation services</h3>
<div class="gridded_frame_with_columns e-frame">
<div id="orga90dd9a" class="figure">
<p><img src="structurizr-1-008-FederatedSocial-02.png" alt="structurizr-1-008-FederatedSocial-02.png" width="40%" />
<div class="one_of_2_columns">
<div id="orgaaa7668" class="figure">
<p><img src="structurizr-1-008-FederatedSocial-02.png" alt="structurizr-1-008-FederatedSocial-02.png" width="70%" />
</p>
</div>
</div>
</section>
<section id="slide-orgb28a1c7" data-background="./bCardBackground.png">
<h3 id="orgb28a1c7">Federated services 3/8 &#x2013; federation 1</h3>
<div class="e-frame">
<div id="orge2edf10" class="figure">
<p><img src="structurizr-1-009-FederatedSocial-03.png" alt="structurizr-1-009-FederatedSocial-03.png" width="75%" />
<div class="one_of_2_columns">
<ul>
<li class="fragment appear">Same as before, the user access the service through an App that uses an API</li>
<li class="fragment appear">As federated services are small, the administrator and the moderator are the one person</li>
<li class="fragment appear">No algorithmic feeds, though
<ul>
<li>not popular in the fediverse community</li>
<li>difficult to implement in a federated environment.</li>
</ul></li>
</ul>
</div>
</div>
</section>
<section id="slide-org5e902a8" data-background="./bCardBackground.png">
<h3 id="org5e902a8">Federated services 3/8 &#x2013; federation 1</h3>
<div class="gridded_frame_with_columns e-frame">
<div class="one_of_2_columns" style="width: 60%">
<div id="org2937f1f" class="figure">
<p><img src="structurizr-1-009-FederatedSocial-03.png" alt="structurizr-1-009-FederatedSocial-03.png" width="100%" />
</p>
</div>
</div>
<div class="one_of_2_columns" style="width: 40%">
<ul>
<li>Same as before, the user access the service through an App that uses an API</li>
<li>As federated services are small, the administrator and the moderator are the one person</li>
<li>No algorithmic feeds, though
<ul>
<li>not popular in the fediverse community</li>
<li>difficult to implement in a federated environment.</li>
</ul></li>
<li class="fragment appear">Federation service to push activity out to the federated network</li>
<li class="fragment appear">Federation API to take in activity from other nodes</li>
<li class="fragment appear">A logical database of inbound federated posts</li>
<li class="fragment appear">Federation using ActivityPub standard</li>
</ul>
</div>
</div>
</section>
<section id="slide-org3b4e10b" data-background="./bCardBackground.png">
<h3 id="org3b4e10b">Federated services 4/8 &#x2013; federation 2</h3>
<section id="slide-orgac74a6b" data-background="./bCardBackground.png">
<h3 id="orgac74a6b">Federated services 4/8 &#x2013; federation 2</h3>
<div class="e-frame">
<div id="org0e3b031" class="figure">
<div id="org429dfd2" class="figure">
<p><img src="structurizr-1-010-FederatedSocial-04.png" alt="structurizr-1-010-FederatedSocial-04.png" width="75%" />
</p>
</div>
</div>
</section>
<section id="slide-orgabd564a" data-background="./bCardBackground.png">
<h3 id="orgabd564a">Federated services 5/8 &#x2013; federation 3</h3>
<section id="slide-org6cfead5" data-background="./bCardBackground.png">
<h3 id="org6cfead5">Federated services 5/8 &#x2013; federation 3</h3>
<div class="e-frame">
<div id="org8193960" class="figure">
<div id="org9f9059a" class="figure">
<p><img src="structurizr-1-011-FederatedSocial-05.png" alt="structurizr-1-011-FederatedSocial-05.png" width="75%" />
</p>
</div>
</div>
</section>
<section id="slide-org3192c60" data-background="./bCardBackground.png">
<h3 id="org3192c60">Federated services 6/8 &#x2013; federation 4</h3>
<section id="slide-org5243619" data-background="./bCardBackground.png">
<h3 id="org5243619">Federated services 6/8 &#x2013; federation 4</h3>
<div class="e-frame">
<div id="org8fc780a" class="figure">
<div id="org4e6a900" class="figure">
<p><img src="structurizr-1-012-FederatedSocial-06.png" alt="structurizr-1-012-FederatedSocial-06.png" width="75%" />
</p>
</div>
</div>
</section>
<section id="slide-org0ed36e8" data-background="./bCardBackground.png">
<h3 id="org0ed36e8">Federated services 7/8 &#x2013; federation 5</h3>
<section id="slide-orgd736c9b" data-background="./bCardBackground.png">
<h3 id="orgd736c9b">Federated services 7/8 &#x2013; federation 5</h3>
<div class="e-frame">
<div id="org229c0dd" class="figure">
<div id="org19262e6" class="figure">
<p><img src="structurizr-1-013-FederatedSocial-07.png" alt="structurizr-1-013-FederatedSocial-07.png" width="75%" />
</p>
</div>
</div>
</section>
<section id="slide-orgda39674" data-background="./bCardBackground.png">
<h3 id="orgda39674">Federated services 8/8 &#x2013; federation 6</h3>
<section id="slide-orgf1adf69" data-background="./bCardBackground.png">
<h3 id="orgf1adf69">Federated services 8/8 &#x2013; federation 6</h3>
<div class="e-frame">
<div id="org4c36e78" class="figure">
<div id="org2ad7a74" class="figure">
<p><img src="structurizr-1-014-FederatedSocial-08.png" alt="structurizr-1-014-FederatedSocial-08.png" width="75%" />
</p>
</div>

99
BlueskyArchitecture.org
View file

@ -41,30 +41,77 @@
file:structurizr-1-001-GenericSocial-01.png
#+REVEAL_HTML: </div>
** Simplistic view 2/2 -- services
#+REVEAL_HTML: <div class="e-frame">
#+ATTR_HTML: :width 20%
#+REVEAL_HTML: <div class="gridded_frame_with_columns e-frame">
#+REVEAL_HTML: <div class="one_of_2_columns">
#+ATTR_HTML: :width 40%
file:structurizr-1-002-GenericSocial-02.png
#+REVEAL_HTML: </div>
#+REVEAL_HTML: <div class="one_of_2_columns">
#+ATTR_REVEAL: :frag (appear)
- Social media user access the app
- The app interacts with the API
- The API is the gateway for the database of posts, responses, likes, etc.
#+REVEAL_HTML: </div>
#+REVEAL_HTML: </div>
** More realistic view 1/4 -- overview
#+REVEAL_HTML: <div class="e-frame">
#+ATTR_HTML: :width 90%
file:structurizr-1-003-RealisticSocial-01.png
#+REVEAL_HTML: </div>
** More realistic view 2/4 -- basic services
#+REVEAL_HTML: <div class="e-frame">
#+ATTR_HTML: :width 40%
#+REVEAL_HTML: <div class="gridded_frame_with_columns e-frame">
#+REVEAL_HTML: <div class="one_of_2_columns">
#+ATTR_HTML: :width 70%
file:structurizr-1-004-RealisticSocial-02.png
#+REVEAL_HTML: </div>
#+REVEAL_HTML: <div class="one_of_2_columns">
#+ATTR_REVEAL: :frag (appear)
- Social media user access the app
- The app interacts with the API
- The API is the gateway for the database of posts, responses, likes, etc.
- The API also captures data for building profiles of users for targeting purposes
- The algorithmic feed generator guides the API on what posts to place into the app's feed
#+REVEAL_HTML: </div>
#+REVEAL_HTML: </div>
** More realistic view 3/4 -- the algorithm
#+REVEAL_HTML: <div class="e-frame">
#+ATTR_HTML: :width 40%
#+REVEAL_HTML: <div class="gridded_frame_with_columns e-frame">
#+REVEAL_HTML: <div class="one_of_2_columns">
#+ATTR_HTML: :width 70%
file:structurizr-1-005-RealisticSocial-03.png
#+REVEAL_HTML: </div>
#+REVEAL_HTML: <div class="one_of_2_columns">
- Social media user access the app
- The app interacts with the API
- The API is the gateway for the database of posts, responses, likes, etc.
- The API also captures data for building profiles of users for targeting purposes
- The algorithmic feed generator guides the API on what posts to place into the app's feed
- Algorithmic feeds are created by the service administrator, using an app only /they/ have access to
#+REVEAL_HTML: </div>
#+REVEAL_HTML: </div>
** More realistic view 4/4 -- content moderation
#+REVEAL_HTML: <div class="e-frame">
#+ATTR_HTML: :width 60%
#+REVEAL_HTML: <div class="gridded_frame_with_columns e-frame">
#+REVEAL_HTML: <div class="one_of_2_columns">
#+ATTR_HTML: :width 100%
file:structurizr-1-006-RealisticSocial-04.png
#+REVEAL_HTML: </div>
#+REVEAL_HTML: <div class="one_of_2_columns">
- Social media user access the app
- The app interacts with the API
- The API is the gateway for the database of posts, responses, likes, etc.
- The API also captures data for building profiles of users for targeting purposes
- The algorithmic feed generator guides the API on what posts to place into the app's feed
- Algorithmic feeds are created by the service administrator, using an app only /they/ have access to
- Moderation is also performed by a member of the service's staff, using a dedicate app and services the the user doesn't have access to
#+REVEAL_HTML: </div>
#+REVEAL_HTML: </div>
* Federated social media services
** Federated services 1/8 -- overview
#+REVEAL_HTML: <div class="e-frame">
@ -72,15 +119,43 @@
file:structurizr-1-007-FederatedSocial-01.png
#+REVEAL_HTML: </div>
** Federated services 2/8 -- internal, administration and content moderation services
#+REVEAL_HTML: <div class="e-frame">
#+ATTR_HTML: :width 40%
#+REVEAL_HTML: <div class="gridded_frame_with_columns e-frame">
#+REVEAL_HTML: <div class="one_of_2_columns">
#+ATTR_HTML: :width 70%
file:structurizr-1-008-FederatedSocial-02.png
#+REVEAL_HTML: </div>
#+REVEAL_HTML: <div class="one_of_2_columns">
#+ATTR_REVEAL: :frag (appear)
- Same as before, the user access the service through an App that uses an API
- As federated services are small, the administrator and the moderator are the one person
- No algorithmic feeds, though
+ not popular in the fediverse community
+ difficult to implement in a federated environment.
#+REVEAL_HTML: </div>
#+REVEAL_HTML: </div>
** Federated services 3/8 -- federation 1
#+REVEAL_HTML: <div class="e-frame">
#+ATTR_HTML: :width 75%
#+REVEAL_HTML: <div class="gridded_frame_with_columns e-frame">
#+REVEAL_HTML: <div class="one_of_2_columns" style="width: 60%">
#+ATTR_HTML: :width 100%
file:structurizr-1-009-FederatedSocial-03.png
#+REVEAL_HTML: </div>
#+REVEAL_HTML: <div class="one_of_2_columns" style="width: 40%">
#+ATTR_REVEAL: :frag (none none none appear)
- Same as before, the user access the service through an App that uses an API
- As federated services are small, the administrator and the moderator are the one person
- No algorithmic feeds, though
+ not popular in the fediverse community
+ difficult to implement in a federated environment.
- Federation service to push activity out to the federated network
- Federation API to take in activity from other nodes
- A logical database of inbound federated posts
- Federation using ActivityPub standard
#+REVEAL_HTML: </div>
#+REVEAL_HTML: </div>
** Federated services 4/8 -- federation 2
#+REVEAL_HTML: <div class="e-frame">
#+ATTR_HTML: :width 75%

2
gridding.css
View file

@ -15,10 +15,12 @@
.one_of_2_columns {
width: 50%;
align-content: center;
}
.one_of_3_columns {
width: 33%;
align-content: center;
}
.column_with_rows {