Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Scrollytelling the 53 Stations of Tōkaidō: An I...

Avatar for Sorami Shiromizu Sorami Shiromizu
September 13, 2024
Programming
310
1

Scrollytelling the 53 Stations of Tōkaidō: An Interactive Journey Through Japan’s Historic Route / BUILD with Mapbox 2024

BUILD with Mapbox 2024 - Developer Show & Tell
https://www.mapbox.com/build

Avatar for Sorami Shiromizu

Sorami Shiromizu

September 13, 2024

More Decks by Sorami Shiromizu

See All by Sorami Shiromizu
オープンソースとビジネス: 位置情報の世界からみえる流れ / 札幌IT石狩鍋#2
Avatar for Sorami Shiromizu sorami
1
720
How I Got Here - NLP, Geospatial, and beyond / NAIST NLP
Avatar for Sorami Shiromizu sorami
1
320
Scrollytelling the 53 Stations of Tōkaidō: An Interactive Journey Through Japan’s Historic Route / FOSS4G ASIA 2024
Avatar for Sorami Shiromizu sorami
1
300
Rust for Geospatial Data Processing: A Case Study with CityGML Converter for PLATEAU, Japan's Open Digital Twin Models / FOSS4G ASIA 2024
Avatar for Sorami Shiromizu sorami
1
390
CSSを積み重ねる - 2024年のMasonry Layout / MIERUNE 朝LT #297
Avatar for Sorami Shiromizu sorami
3
410
可視化がやりたくてMIERUNEに転職した話 〜“思考のための道具”とコンピューターによる新たな表現〜 / MIERUNE JCT - Tokyo 2024
Avatar for Sorami Shiromizu sorami
4
2.8k
データ可視化をやりたくて北海道におひっこし / TechRAMEN 2024 Conference
Avatar for Sorami Shiromizu sorami
2
1.5k
Svelte採用記 - 位置情報と可視化の会社で、全社の標準技術スタックに選ぶまで / Svelte Japan Online Meetup #3
Avatar for Sorami Shiromizu sorami
3
1.9k
「スクローリーテリング」から考えるジューシーなメディア / Data Visualization Japan Meetup 2023
Avatar for Sorami Shiromizu sorami
3
1.8k

Other Decks in Programming

See All in Programming
20260828_品質と開発生産性を両立させる、AI時代のE2Eテストの考え方
Avatar for MagicPod magicpod
0
210
Streamlitで実現する自然言語データアプリ開発
Avatar for Ayumu Yamaguchi ayumu_yamaguchi
0
270
Java 27新機能 / Java 27 new features
Avatar for Naoki Kishida kishida
2
140
速く作れる。その次は、速く確かめられる開発へ 〜AIネイティブ開発を支える、Shift Down〜 / Can build fast. Next, moving to development where we can verify fast.
Avatar for r-kagaya rkaga
3
2.2k
標準パッケージに uuid が追加された 背景から見る Go らしい意思決定 / go_127_uuid_decision
Avatar for convto convto
5
7.1k
アクセシビリティから考える情報設計
Avatar for high-g high_g_engineer
0
370
kubernetes コンポーネント開発入門 / 新卒N年目の勉強会&交流会！〜〇〇への誘い〜 #n_study
Avatar for mazrean mazrean
0
240
WebRTC映像をAirPlayに対応させる挑戦.pdf
Avatar for monolithic-adam monolithic_adam
0
240
大喜利で理解するLLM as a Judge / Understanding LLM-as-a-Judge through Ogiri
Avatar for rockname rockname
0
100
Go × SIMDで高速化するベクトル検索 ~ルーフラインモデルでSIMDが効く境界を探れ！ ~
Avatar for po3rin po3rin
1
880
Security issues being discussed on Web Platforms
Avatar for petamoriken / 森建 petamoriken
0
930
GKE で Pod の見方を変えたら、スケールアウト時の挙動を真に捉えられた話
Avatar for Sota Takaki stkk
0
120

Featured

See All Featured
Darren the Foodie - Storyboard
Avatar for Kevinho.art khoart
PRO
4
3.9k
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
1
470
The Curse of the Amulet
Avatar for Matthew Lei leimatthew05
3
14k
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
39
3.4k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3.7k
Claude Code のすすめ
Avatar for schroneko schroneko
67
230k
Evolving SEO for Evolving Search Engines
Avatar for Ryan Jones ryanjones
0
290
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
240
Introduction to Domain-Driven Design and Collaborative software design
Avatar for Kenny Baas-Schwegler baasie
1
990
Odyssey Design
Avatar for Ryan Kendrick rkendrick25
PRO
2
810
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
75
12k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
528
40k

Transcript

  1. Scrollytelling the 53 Stations of Tōkaidō "O*OUFSBDUJWF+PVSOFZ5ISPVHI+BQBO`T)JTUPSJD3PVUF !TPSBNJ  #6*-%XJUI.BQCPY

  2. !TPSBNJ )*4".0504PSBNJ ‣ !.*&36/&*OD BHFPTQBUJBMDPNQBOZJO+BQBO ‣ &YQMPSJOH5PPMTGPS5IPVHIUXJUIDPNQVUFST ‣ l5PLBJEP4DSPMMZUFMMJOHzJTNZTJEFQSPKFDU )FMMP

    .BQCPYEFWFMPQFST

  3. IUUQTTPSBNJEFWUPLBJEPTDSPMMZUFMMJOH

  4. IUUQTTPSBNJEFWUPLBJEPTDSPMMZUFMMJOH

  5. IUUQTTPSBNJEFWUPLBJEPTDSPMMZUFMMJOH

  6. IUUQTTPSBNJEFWUPLBJEPTDSPMMZUFMMJOH IUUQTTPSBNJEFWUPLBJEPTDSPMMZUFMMJOH

  7. The 53 Stations of the Tōkaidō ౦ւಓޒेࡾ࣍, Tōkaidō Gojūsan-tsugi ‣

    *DPOJDSFTUBSFBTPOUIFIJTUPSJDDPBTUBMSPBECFUXFFO5PLZPBOE,ZPUP ‣ 3FOPXOFEGPS6LJZPFQSJOUT B+BQBOFTFQBJOUJOHTUZMFGSPNUIDFOUVSJFT 6UBHBXB)JSPTIJHFʠ5IF'JGUZUISFF4UBUJPOTPGUIF5⒕LBJE⒕ʡ )⒕FJE⒕FEJUJPO r 4UBSU/JIPOCBTIJ 5PLZP 4BLBTIJUB &OE4BOK⒕⒚IBTIJ ,ZPUP

  8. 4$30--:5&--*/(

  9. 4$30-- 4503:5&--*/( ʴ

  10. 8IZ 4DSPMMZUFMMJOH

  11. 4DSPMMJTFBTJFSUIBODMJDLJOH+PTIVB1PSUFS  IUUQCPLBSEPDPNBSDIJWFTTDSPMMJOHFBTJFSDMJDLJOH lTDSPMMJOHJTBDPOUJOVBUJPODMJDLJOHJTBEFDJTJPOz

  12. 5IF3IZUINPG:PVS4DSFFO$ISJTUPQIFS#VUMFS  IUUQTXXXDISCVUMFSDPNUIFSIZUINPGZPVSTDSFFO ‣ &WJEFODFUIBUQFPQMFXPO`UTDSPMM EPFTO`UFYJTU ‣ 5IFRVFTUJPOJTOPU l8JMMUIFVTFSTDSPMM z

    CVU l8JMMUIFZTDSPMMTMPXMZFOPVHI z

  13. 5IF3IZUINPG:PVS4DSFFO$ISJTUPQIFS#VUMFS  IUUQTXXXDISCVUMFSDPNUIFSIZUINPGZPVSTDSFFO ‣ 4DBOOJOHJTSFBDUJPO 3FBEJOHJTBDIPJDF ‣ "ODIPSJNQPSUBOUJOGPJOBDPOTJTUFODFQMBDF ‣ 3FQFUJUJPOJTJOGPSNBUJPO

    ‣ &NQUZTQBDFJTOPUOFVUSBM l4USVDUVSFzBOEl3IZUINz -FOHUIJTOPUUIFQSPCMFN -BDLPGSIZUINJT

  14. 5IF1BTU 1SFTFOU BOE'VUVSFPG4DSPMMZUFMMJOH#JMM4IBOEFS  IUUQTOJHIUJOHBMFEWTDPNUIFQBTUQSFTFOUBOEGVUVSFPGTDSPMMZUFMMJOH l5IFSFJTBUPOPGSFTFBSDIPOIVNBOT`MJNJUFEBCJMJUZ UPSFUBJOJOGPSNBUJPO DPHOJUJWFMPBE BOEIPXUIBU BGGFDUTQSPDFTTJOHJOGPSNBUJPO<ʜ>4DSPMMZUFMMJOH

    IFMQTTPMWFUIJTQSPCMFN &WFSHSFFOTBZT CFDBVTF JU`TBCPVUTQPPOGFFEJOHPVSBVEJFODFl*UTPVOET MJLFJOGBOUBMJ[JOHUIFNCVUJU`TOPU zTIFBEET TBZJOH XFOFFEUPVOEFSTUBOEUIFNBOEUIFJSOFFET BOE BDLOPXMFEHJOHPVSDPHOJUJWFMJNJUBUJPOTBMMPXTVTUP DIPPTFNFUIPETPGDPOUFOUEFMJWFSZUPNBYJNJ[FPVS SFTVMUTz

  15. 5IF1BTU 1SFTFOU BOE'VUVSFPG4DSPMMZUFMMJOH#JMM4IBOEFS  IUUQTOJHIUJOHBMFEWTDPNUIFQBTUQSFTFOUBOEGVUVSFPGTDSPMMZUFMMJOH l4DSPMMZUFMMJOHJTBDUVBMMZBQFSGFDUNJNJDSZPGWJEFP XJUIUIFBEEFEBCJMJUZUPTMPXJUEPXOPSTQFFEJUVQ  BMMXIJMFTFFJOHFWFSZGSBNFBMPOHUIFXBZ*U`TMJLF IJHIMZQFSGPSNBOUWJEFPTDSVCCJOHXIFSFXFEPO`U

    NJTTBCFBU5IJOHTIBQQFOJOBMJOFBSXBZ PWFSUJNF  POFUIJOHBUBUJNF KVTUMJLFSFBMJUZCVUCFUUFS  CFDBVTFXFIBWFTPNFDPOUSPMPWFSUIFQBDFBOE EJSFDUJPOl

  16. )PXUPJNQMFNFOU 4DSPMMZUFMMJOH

  17. *OUFSTFDUJPO0CTFSWFS"1* .POJUPSTUBSHFUFMFNFOUTFOUFSJOH JOUFSTFDUJOH UIFTQFDJ fi FESBOHF .PSFEJSFDUBOEFBTJFSUIBOUIFQSFWJPVTNFUIPEVTJOHTDSPMMFWFOUT

  18. 4DSPMMBNB "MJCSBSZGPS4DSPSZUFMMJOHXJUI*OUFSTFDUJPO0CTFSWFS"1* 4QFDJGZDMBTTOBNFUPUIFFMFNFOU BOEFYFDVUFXIFOUIFZFOUFSTFYJUT IUUQTQVEEJOHDPPMQSPDFTTJOUSPEVDJOHTDSPMMBNB IUUQTHJUIVCDPNSVTTFMMTBNPSBTDSPMMBNB CZ3VTTFMM4BNPSB !5IF1VEEJOH

  19. ':*0MEMJCSBSJFT "SUJDMFDPNQBSJOHWBSJPVTMJCSBSJFTCZUIFBVUIPSPG4DSPMMBNB +BOVBSZ  ˠ5IFO 4DSPMMBNB /PWFNCFS IUUQTQVEEJOHDPPMQSPDFTTIPXUPJNQMFNFOUTDSPMMZUFMMJOH 8BZQPJOUT 4DSPMM4UPSZ

    4DSPMM.BHJD HSBQITDSPMMKT JOWJFXKT  *NQMFNFOUCZZPVSTFMGXJUIXJOEPXBEE&WFOU-JTUFOFS TDSPMM 

  20. (4"1CZ(SFFO4PDL "+BWB4DSJQUBOJNBUJPOMJCSBSZ 5IFSFJTBQMVHJOUIBUNBLFTUIFBOJNBUJPOXPSLXJUITDSPMMJOH IUUQTHSFFOTPDLDPNTDSPMMUSJHHFS IUUQTHJUIVCDPNCBTFNFOUTUVEJPTDSPMMZUFMMJOH 4DSPMM5SJHHFSQMVHJO 4DSPMM5SJHHFSGPS3FBDU

  21. 4WFMUF1BUUFSOT %BUBWJTVBMJ[BUJPOQBUUFSOTXJUIB8FCGSBNFXPSLl4WFMUFz *OUSPEVDFTlTWFMUFTDSPMMFSzBOElTWFMUFJOUFSTFDUJPOPCTFSWFSz IUUQTSFVUFSTHSBQIJDTHJUIVCJPFYBNQMF@TWFMUFHSBQIQBUUFSOT CZ%FB#BOLPWB !3FVUFST

  22. .BQCPYlTUPSZUFMMJOHzUFNQMBUF "UFNQMBUF OPUMJCSBSZ GPS.BQCPY(-+4 :PVDBOJNQMFNFOUBTDSPMMZUFMMJOHXJUIMJUUMFDPEJOH IUUQTHJUIVCDPNNBQCPYTUPSZUFMMJOH IUUQTXXXNBQCPYDPNCMPHIPXUPCVJMEBTDSPMMZUFMMJOHNBQ

  23. $BTF4UVEZ 5PLBJEP4DSPMMZUFMMJOH

  24. IUUQTTPSBNJEFWUPLBJEPTDSPMMZUFMMJOH

  25. %BUB KBXJLJQFEJBPSHXJLJ౦ւಓޒेࡾ࣍@ ුੈֆ HJUIVCDPNKBQBOSPBEKQ(PLBPEP.BQ HJUIVCDPNTPSBNJUPLBJEPTDSPMMZUFMMJOH 1BJOUJOHT CZ6UBHBXB)JSPTIJHF 1VCMJDEPNBJO )PFJEPFEJUJPO 3PBET

    lKBQBOSPBEKQ(PLBPEP.BQzEBUBTFU $$#:/$4" 4FBXBZIBOEESBXOJO2(*4 4UBUJPOT .BOVBMMZQSFQBSFEGSPN8JLJQFEJBBSUJDMF %FTDSJQUJPOGFUDIFEXJUI8JLJQFEJB"1* 1SFQSPDFTTJOHJO+VQZUFS/PUFCPPL

  26. $PEF 4DSPMMBNB 4WFMUF 5PNBOBHFUIF6*DPNQPOFOUT .BQCPY(-+4 5IFNBQ 6OP$44 6UJMJUZGJSTU$44GSBNFXPSL 5VSGKT 5PDBMDVMBUFUIFEJSFDUJPOPGUIFOFYUTUBUJPO

     BOETFUUIFDBNFSBBOHMF
  27. None

  28. $PEF%BUBQVCMJDMZBWBJMBCMF IUUQTHJUIVCDPNTPSBNJUPLBJEPTDSPMMZUFMMJOH

  29. ‣8FCIUUQTTPSBNJEFW ‣&NBJMIJ!TPSBNJEFW ‣.BTUPEPOTPSBNJ!WJTTPDJBM ‣9!TPSBNJ