[[HYPERTEXT|early HT]]
(mouseover-replace: "HYPER")[CYBER]
(mouseout-replace: "CYBER")[HYPER]
(mouseover-replace:"TEXT")[MEDIA]
(mouseout-replace:"MEDIA")[TEXT]
NODES------------NODES------------NODES
(click-replace:"NODES")[PASSAGES]
(click-replace:"PASSAGES")[PAGES]
(click-replace:"------------")[-hyperlinks-]
(link-reveal: "Examples:")[ <a href="https://en.wikipedia.org/wiki/Special:Random" target="_blank">WIKIPEDIA</a>
<a href="http://www.buzzfeed.com/joannaborns/human-or-mannequin#.rsDJnq86d" target="_blank">THE WHOLE INTERNET</a>]
<a href="http://www.luminousairplanes.com/" target="_blank">Luminous Airplanes</a> by Paul La Farge
<a href="http://www.thetherapist.com/" target="_blank">The Company Therapist</a> (1996)
<a href="http://selectadecision.info/" target="_blank">You Will Select A Decision</a>
<a href="http://collection.eliterature.org/1/works/ingold__all_roads.html" target="_blank">All Roads</a> by John Ingold (2001)
<a href="http://www.thejewsdaughter.com/" target="_blank">The Jew's Daughter</a> by Judd Morrissey (2002)
<a href="http://unknownhypertext.com/" target="_blank">THE UNKNOWN</a> by William Gillespie, Scott Rettberg, Dirk Stratton & Frank Marquardt
<a href="http://ifdb.tads.org/" target="_blank">INTERACTIVE FICTION DATABASE </a>
1. Arborescent
2. Axial
3. Networked
<img src="http://55.media.tumblr.com/72001f7964ca784ecee460a7e3069832/tumblr_inline_o12rl59mdF1txkbzy_540.gif">
<img src="http://55.media.tumblr.com/734c32932d0f7188f3cebd837acfbe42/tumblr_inline_o12rl2xpma1txkbzy_540.gif">
<img src="http://55.media.tumblr.com/bfada6139109d4a5b29612abc0f322b1/tumblr_inline_o12rkzlY2V1txkbzy_500.gif">
<img src="http://55.media.tumblr.com/69d83e81c2de78fd8697da784d6ed3de/tumblr_inline_o12rl8bz0q1txkbzy_540.gif">
<img src="http://55.media.tumblr.com/3f8ac0cc37d34ca9ab60d253fd4a087d/tumblr_inline_o12rkxASxW1txkbzy_540.gif">
<img src="http://55.media.tumblr.com/d0fd1e63b533019f0c399d61dcd56733/tumblr_inline_o12rksIzs31txkbzy_540.gif">
<img src="http://55.media.tumblr.com/9ed01a026bdb8845adf9c47b84482bf2/tumblr_inline_o12rkmhuUD1txkbzy_540.gif">
<img src="http://55.media.tumblr.com/86ab238789002b03aaf71a59add0d6ca/tumblr_inline_o12rkkLCSK1txkbzy_500.gif">
<img src="http://55.media.tumblr.com/589930441ff181c0b355b28038c756d4/tumblr_inline_o12rkj70k91txkbzy_540.gif">
<img src="http://55.media.tumblr.com/241dc41e50c2b1b5226d57b3e59b772a/tumblr_inline_o12rkorKt71txkbzy_540.gif">
[[TWINE]] (2009)
I made [[The Cardiff Giant]] between the summers of 2014 and 2015. It began as a multimedia crossover between AMC's TV series [[Halt and Catch Fire]] and Cardboard Computer's point-and-click game [[Kentucky Route Zero]], but became a mostly-original hypertext adventure [[over 63000 words long, with 1278 passages connected by 2373 links.|storymap]]
<a href="http://philome.la/girl_krieg/the-cardiff-giant" target="_blank">play it at philome.la</a>
<img src="https://55.media.tumblr.com/be1e9709c58e8d485a66d69e688ac335/tumblr_inline_o12takWxZc1txkbzy_540.gif">
I chose to mimic [[Kentucky Route Zero]]'s combination of point-and-click mechanics, scriptlike dialog format, and adventure game-style character choices. I started with the settings and characters from [[Halt and Catch Fire]], but soon added my own material as the story expanded.
<img src="https://55.media.tumblr.com/2eecec3e68a770e7981b36a03e6e30e9/tumblr_inline_o12takzLpW1txkbzy_540.gif">
Even though my technical grasp of Twine was very limited, I was able to experiment with [[exploration scenes]], different [[ story layouts]], and a variety of [[visual effects]].
[[Making your own twine >>>]]
<img src= "http://38.media.tumblr.com/a26b4011d03893d98d354808f028a0ab/tumblr_nopoj1enEI1thukw2o1_540.gif">
HCF is a fictional spin on the PC revolution in the 1980's. It has to do with early computer games, the development of user interfaces, and the advent of the WWW.
<img src= "http://3.bp.blogspot.com/-YVDdQD9Z4R4/U7oQLUjUn_I/AAAAAAAAH1c/3JHtW3sCvxw/s1600/Halt.and.Catch.Fire.S01E06.jpg">
[[Back.|giant]]
<img src= "http://www.creativeapplications.net/wp-content/uploads/2013/01/Kentucky-Route-Zero-4.png">
KRZ is an atmospheric exploration game with its origins in early hypertext and text-based computer games.
<img src="http://www.destructoid.com/ul/243432-review-kentucky-route-zero/shannon-620x.jpg">
[[Back.|giant]]
<img src="http://56.media.tumblr.com/a68bd7d46132b568a9bcfe548fd65b9d/tumblr_o12m4zoO2L1ua4zg0o1_1280.png">
[[Back.|giant]]
<img src= "https://55.media.tumblr.com/54379b6547ce2e80f90d53cf81e7eed2/tumblr_inline_o12taqrpWN1txkbzy_540.gif">
The highway exploration scene used linked symbols ((color:#ffcc00)[<, >, ^, v]) to imitate arrow keys instead of hyperlinking words or phrases. Every node or passage represented a "square" on a hypothetical grid-like map.
<img src= "https://55.media.tumblr.com/24d363fb924879b0ae48b1775d4160b8/tumblr_inline_o12tawe2731txkbzy_540.gif">
The cave exploration scene used dialog options to allow players to wind their way (color:#ffcc00)[left], (color:#ffcc00)[right], or (color:#ffcc00)[backward] through a forking maze. I also added another option, (color:#ffcc00)[(Lights off.)], which took the player to a parallel passage with something different occupying the same "space" in the maze.
[[Back.|The Cardiff Giant]]
<img src= "https://55.media.tumblr.com/b3dbf8075ae928a5aa2a025c965253d3/tumblr_inline_o12tb1DHtj1txkbzy_540.gif">
This scene is about a work of nonlinear fiction in print, where hyperlinks represent characters' navigation between page numbers of a physical book.
[[Back.|The Cardiff Giant]]
<img src="https://55.media.tumblr.com/9613c14824d3be0175078ad4914f74e9/tumblr_inline_o12tb5yyzE1txkbzy_540.gif">
[[Back.|The Cardiff Giant]]
<img src="https://55.media.tumblr.com/07f4038f3c1baa4ef850c12811c8cff6/tumblr_inline_o12tb9OXgR1txkbzy_540.gif">
<a href="http://hypercard.org/" target="_blank">HyperCard</a>(1987)
<a href="http://xanadu.com/xUniverse-D6" target="_blank">Project Xanadu</a>(1960-1988-???)
[[Storyspace]] (1987)
HYPERTEXT [[FICTION]]
<img src="http://susangibb.net/blog2/wp-content/uploads/2009/03/032109h.jpg">
<img src= "http://www.eastgate.com/Tinderbox/elements/2015WinterFest/Storyspace.png">
<img src= "http://computersandcomposition.candcblog.org/archives/v9/9_2_html/9_2_7_Johnson4.jpg"><img src= "http://computersandcomposition.candcblog.org/archives/v9/9_2_html/9_2_7_Johnson6.jpg">
<img src= "http://www.cddc.vt.edu/host/deena/ht04paper/larsen/larseninterlink.gif">
<img src= "https://journals.tdl.org/jodi/index.php/jodi/article/viewFile/171/485/3785">
<img src="http://nt2.uqam.ca/sites/nt2.uqam.ca/files/styles/flexslider_big_thumbnails/public/nt2-09-ce01-1024x768-afternoon.jpg?itok=bjdIFFCX">
<img src="http://57.media.tumblr.com/b6fb81ed5db650bfbe5f81ae792ea9be/tumblr_o146b21Zn21ua4zg0o1_1280.gif">
<a href="http://www.wwnorton.com/college/english/pmaf/hypertext/aft/index.html" target="_blank">Afternoon, a Story</a> by Michael Joyce (1990)
(link-reveal: "More:")[
<a href="http://www.wwnorton.com/college/english/pmaf/hypertext/ihsn/i_have_said_nothing.html" target="_blank">I Have Said Nothing</a> by Jane Douglas (1994)
[[Patchwork Girl]] by Shelley Jackson (1995)]
<img src="http://elmcip.net/sites/default/files/media/work/images/patch.png">
<img src="https://interactivelitspring2015.files.wordpress.com/2015/03/f4a7c-patchwork-girl.gif"><img src="https://parttimemonster.files.wordpress.com/2015/04/patchworkgirl.gif"><img src="http://marcominghetti.nova100.ilsole24ore.com/wp-content/uploads/sites/80/imported/6a00d8341c684553ef015392b0492d970b-pi.jpg">
<a href="http://www.yorku.ca/caitlin/waves/navigate.html" target="_blank">These Waves of Girls</a> by Caitlin Fisher (2001)
<a href="http://auntiepixelante.com/endoftheworld/" target="_blank">Queers in love at the end of the world</a>
by <a href="http://www.auntiepixelante.com/games/" target="_blank">Anna Anthropy</a>
<a href="http://aliendovecote.com/intfic.html" target="_blank">PORPENTINE</a>
[[More >>>|all different kinds]]
(link-reveal: "ERGODIC LITERATURE")[ requires a non-trivial readerly effort to traverse the text.]
Print Fiction:
<img src= "http://ecx.images-amazon.com/images/I/51%2BFFnEAW3L._SX320_BO1,204,203,200_.jpg">
Game Books:
<a href="http://www.intotheabyss.net/directions/" target="_blank"><img src="https://upload.wikimedia.org/wikipedia/en/2/2a/MAZE_Manson.png"></a>
Digital hypertext:
[[<img src= "http://www.wwnorton.com/college/english/pmaf/hypertext/aft/images/afty.jpg">|afternoon]]
<a href="http://twinery.org/" target="_blank">Website</a>
<img src="http://pixelles.ca/wordpress/wp-content/uploads/2015/10/unnamed.png">
<img src="https://hiyashi.files.wordpress.com/2013/11/myfirsttwinegame-davincicode.png">
<img src="https://s3.yimg.com/bt/api/res/1.2/QmZoFv4O3CtZ41PTyKM8vQ--/YXBwaWQ9eW5ld3NfbGVnbztxPTg1O3NtPTE7dz02MzA-/http://l.yimg.com/os/publish-images/games/2015-04-03/062d1030-da21-11e4-8b1f-75c06950bbd5_twine.jpg">
<img src= "http://i2.wp.com/markdangerchen.net/media/blog/2015/01/twine2.coastalrun.png">
Mostly text:
<a href="http://bonsequitur.itch.io/notsomuchastory" target="_blank">It Is Not So Much a Story</a> and <a href="http://correlatedcontents.com/misc/Father.html" target="_blank">My Father's Long, Long Legs</a>
Highly visual:<a href="http://darinacosta.itch.io/endmillenium" target="_blank">End Millenium</a> and
<a href="http://lube.itch.io/stars" target="_blank">Stars</a>
Game: <a href= "http://destroyed4com4t.itch.io/haizara" target="_blank">Haizara<a> and <a href= "http://birdo.itch.io/rock-collector" target="_blank">rock collector<a>
[[My twine|giant]]
MAKING YOUR OWN TWINE
<a href="http://twinery.org/wiki/start" target="_blank">TWINE 1.x MANUAL</a>
<a href="http://twine2.neocities.org/" target="_blank">TWINE 2 MANUAL</a>
<a href="http://www.w3schools.com/cssref/css_colors.asp" target="_blank">HELP WITH STYLESHEETS</a>
<a href="http://www.philome.la/" target="_blank">PUBLISHING YOUR TWINE</a>
<a href="http://twinery.org/" target="_blank">twinery.org</a>
<a href="https://www.youtube.com/watch?v=BXUtXKXIrl0" target="_blank">video of trees</a>
<a href="http://www.clker.com/cliparts/1/2/0/e/12986123281922077915toast1.png" target="_blank">picture of toast</a>
[[MAIN MENU]]
[[Start|Start Passage]]
[[Early hypermedia|early HT]]
[[Cyberfeminist hypertext|Patchwork Girl]]
[[Hypertext examples|all different kinds]]
[[Twine examples|TWINE]]
[[The Cardiff Giant]]
[[Making your own|Making your own twine >>>]]
<img src="http://40.media.tumblr.com/193afab8546e4644baf34b370590957d/tumblr_o14ae8QqoF1ua4zg0o1_1280.png">