129 lines
5.4 KiB
HTML
129 lines
5.4 KiB
HTML
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Kliffy - Klickable Interactive Fiction For You!</title>
|
||
|
|
<style>
|
||
|
|
h1,.demobutton {
|
||
|
|
background: rgb(75,156,0);
|
||
|
|
background-image: -webkit-gradient(
|
||
|
|
linear,
|
||
|
|
left bottom,
|
||
|
|
left top,
|
||
|
|
color-stop(0, rgb(75,156,0)),
|
||
|
|
color-stop(1, rgb(112,224,0))
|
||
|
|
);
|
||
|
|
background-image: -moz-linear-gradient(
|
||
|
|
center bottom,
|
||
|
|
rgb(75,156,0) 0%,
|
||
|
|
rgb(112,224,0) 100%
|
||
|
|
);
|
||
|
|
}
|
||
|
|
h1 {
|
||
|
|
text-align: center;
|
||
|
|
text-shadow: 1px 1px #88FF88;
|
||
|
|
font-size: 8em;
|
||
|
|
margin: 0px;
|
||
|
|
}
|
||
|
|
h3 {
|
||
|
|
font-style: italic;
|
||
|
|
text-align: center;
|
||
|
|
text-shadow: 1px 1px #88FF88;
|
||
|
|
font-size: 1.5em;
|
||
|
|
margin: 0px;
|
||
|
|
background:rgb(75,156,0);
|
||
|
|
}
|
||
|
|
h4 {
|
||
|
|
padding-left: 1em;
|
||
|
|
padding-right: 1em;
|
||
|
|
}
|
||
|
|
body {
|
||
|
|
margin: 0px;
|
||
|
|
background: #ccccff;
|
||
|
|
}
|
||
|
|
p {
|
||
|
|
padding-left: 2em;
|
||
|
|
padding-right: 2em;
|
||
|
|
}
|
||
|
|
pre {
|
||
|
|
margin-left: 10%;
|
||
|
|
margin-right: 10%;
|
||
|
|
padding: 0.5em;
|
||
|
|
width: 80%;
|
||
|
|
background: #AAAAAA;
|
||
|
|
border-radius: 5px;
|
||
|
|
-moz-border-radius: 5px;
|
||
|
|
}
|
||
|
|
a:visited {
|
||
|
|
color: #000077;
|
||
|
|
}
|
||
|
|
a {
|
||
|
|
color: #000044;
|
||
|
|
}
|
||
|
|
.demobutton {
|
||
|
|
background: green;
|
||
|
|
background-image: -webkit-gradient(
|
||
|
|
linear,
|
||
|
|
left bottom,
|
||
|
|
left top,
|
||
|
|
color-stop(0, rgb(75,156,0)),
|
||
|
|
color-stop(1, rgb(112,224,0))
|
||
|
|
);
|
||
|
|
background-image: -moz-linear-gradient(
|
||
|
|
center bottom,
|
||
|
|
rgb(75,156,0) 0%,
|
||
|
|
rgb(112,224,0) 100%
|
||
|
|
);
|
||
|
|
text-align: center;
|
||
|
|
margin-left: 35%;
|
||
|
|
margin-right: 35%;
|
||
|
|
border-radius: 15px;
|
||
|
|
-moz-border-radius: 15px;
|
||
|
|
padding-top: 1em;
|
||
|
|
padding-bottom: 1em;
|
||
|
|
box-shadow: 5px 5px #002200;
|
||
|
|
-webkit-box-shadow: 5px 5px #002200;
|
||
|
|
-moz-box-shadow: 5px 5px #002200;
|
||
|
|
}
|
||
|
|
.demobutton a {
|
||
|
|
color: #000044;
|
||
|
|
text-shadow: 1px 1px #88FF88;
|
||
|
|
text-decoration: none;
|
||
|
|
font-size: 2em;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body><h1>Kliffy</h1>
|
||
|
|
|
||
|
|
<h3>Klickable Interactive Fiction For You!</h3>
|
||
|
|
|
||
|
|
<p><em>Kliffy</em> is an engine for writing parserless point-and-click interactive fiction, in which the entirety of the story uncovered so far is visible at all times, and the player is able to take action or undo previous actions at any point in the story.</p>
|
||
|
|
|
||
|
|
<p>Thus far, there is one proof-of-concept game written in Kliffy, which I call <a href="timemachine.html">Richard and Larry Build a Time Machine</a>. It is to be presented at the <a href="http://emshort.wordpress.com/2011/01/31/announce-if-demo-fair/">2011 IF Demo Fair</a>.</p>
|
||
|
|
|
||
|
|
<div class="demobutton"><a href="timemachine.html">Play Demo</a></div>
|
||
|
|
|
||
|
|
<hr />
|
||
|
|
|
||
|
|
<h4>For players</h4>
|
||
|
|
|
||
|
|
<p>You can always go back and change the past, in any story written using Kliffy, without losing work. If you do something on your first move, and come to regret it on your second-to-last move, Kliffy aims to let you see what will happen if you try something different without starting your game over.</p>
|
||
|
|
|
||
|
|
<p>The way it works in practice can be slightly surprising, however. I'm working to figure out the rough edges, but I'm not there yet.</p>
|
||
|
|
|
||
|
|
<p>When you take an action in Kliffy, it records it as a <em>reaction</em> to the paragraph you clicked on. As you progress through the story, you are building up chain reactions -- when thing A happens, my character reacts this way, which makes thing B happen, which makes my character react that way, etc. If you don't have a reaction to the last paragraph or two, the story will stop and wait for you to specify what the player character will do. This can be surprising if, for example, you go back to undo an action much earlier in the story -- suddenly the chain breaks, the rest of the story disappears, and it looks like your hard work has been lost! Don't worry, it hasn't. As soon as you find your new path to the next part of the story, the game will re-do everything you had told it to do after that point.</p>
|
||
|
|
|
||
|
|
<p>If you have any thoughts on this, or any other interface issue, I'd be delighted to <a href="mailto:jeremy%20dot%20penner%20at%20gmail%20dot%20com">hear from you</a>.</p>
|
||
|
|
|
||
|
|
<h4>For authors</h4>
|
||
|
|
|
||
|
|
<p>If you're interested in writing stories using Kliffy, the good news is that there is no technical reason that I'm aware of why you couldn't start today. The bad news is that stories are written in a completely undocumented dialect of XML. The worse news is that the Kliffy is likely to behave strangely or simply not display anything if you make an error in your story source code, rather than give you a useful error message. If none of these things bother you, feel free to <a href="mailto:jeremy%20dot%20penner%20at%20gmail%20dot%20com">drop me a line</a> and I'd be happy to help you get started.</p>
|
||
|
|
|
||
|
|
<h4>For developers</h4>
|
||
|
|
|
||
|
|
<p>If you are interested in the source code, simply run the following command:</p>
|
||
|
|
|
||
|
|
<pre><code>git clone http://www.information-superhighway.net/kliffy/.git
|
||
|
|
</code></pre>
|
||
|
|
|
||
|
|
<p>Be warned: It's an enormous mess, mangled to accommodate the needs of code which attempts to violate causality. Hungarian notation is used heavily with little explaination. If you would like to attempt to write your own story using Kliffy, know that there will be no error messages to guide your way if you do something wrong; your story will just cease to appear in the browser. Also, there are almost certainly bugs I'm not aware of, in addition to the handful that I am already aware of and have worked around in my story for the purposes of making the deadline.</p>
|
||
|
|
</body>
|
||
|
|
</html>
|