Laurel Kona Goodhart

generativiTea : Creating a little Teabot, short & stout

Mon, 05 Apr 2021

Page Redirection I believe this is the page you are looking for.

User Interface Design for Creative Writing Software

Mon, 16 Mar 2015

Inspiration

The State of Creative Writing Software

For whatever reason, I can never stop thinking about creative writing software (you might be familiar with my promptbot project). Maybe it’s a form of procrastination—I’m forever fidgetting with the software, never actually doing the writing. I have tried a number of different programs, from WriteItNow back in the day, to Scrivener, to Writer’s Cafe, to yWriter, to just about every alternative to Scrivener. While many of them are serviceable, most are little more than pared-down word processors, glorified corkboards, or flow chart makers, and very rarely more than one or two of those. Worst of all—to me—all I’ve seen have the clunkiest, ripped-out-of-the-90s user interfaces. Few take advantage of more recent forms of knowledge organization, such as tagging, nor new forms of interaction such as touch. None look like they were natively written for post-millenial operating systems and devices; to my knowledge, none of them were.

Which is not, in any way, to imply they are totally useless. Certainly word processors, corkboards, and flow charts are useful in creative writing. However, I have found them limiting and wanting. Of the programs I have tried, I prefer Scrivener because I find it the most richly-featured, but still feel constricted by its limited ways of interacting with my writing and its antiquated-looking interface.

Design

Borrowing from Coders — Code Bubbles

It was during my last term as a student, that my Human-Computer Interaction seminar discussed Code Bubbles. My thoughts immediately turned to how I could apply those design decisions to creative writing software. At first I decided that there was not much that would translate usefully; however, the idea kept churning in my brain.

On the surface, the needs of writing creatively are very different from those of writing software. Where an IDE might reasonably include things like tab- completion and templating, these features are of very limited use to creative writing. However, both acts center around both creating content and organizing it. A large codebase can quickly get out of hand if there is no way to usefully understand its structure; likewise, an author can get lost in all the details of a story they are trying to create. When does a particular item or character first appear in the story? Is its appearance described consistently?

The “novel user interface metaphor” developed by Code Bubbles can be usefully extended to the realm of creative writing. More on this later.

Take-aways / novel features of Code Bubbles:

Manipulate snippets
Concurrently-visible working sets
Groups with minimal border decoration, no overlap
Large, pannable 2-D virtual space in which to cluster groups
Small representation (map) of larger virtual space for easy navigation

Interface Metaphor

Essential to good design is an intuitive metaphor—or model—of how elements are organized and can be manipulated. Code Bubbles introduced “bubbles,” but even this is not so much a comprehensive metaphor that fully explans the bubbles’ fuctionality, but mostly serves to emphasize that bubbles fuction differenty from more-familiar “windows.”

Returning to existing creative writing software, many have the same component elements:

hierarchical file system on one side
word processor in the middle
meta-notes on the side
short notes that are rearrangable within a grid

The first two are probably familiar to the user by dint of being related to basic computational tasks. There is no particular metaphor in place that relates these elements with the others; nor, necessarily, does there need to be.

The most novel element is the occasional inclusion of small notes that are rearrangable in a grid. These are always akin to index cards, a simple analogy to the physical world: to add meta-notes to a document in the real world, one might reasonably attach a Post-It note or an index card; the same metaphor is reused for the digital world. But within that analogy, there is actually a loss of usefulness: index cards in the real world can be arranged in more than just a grid. They can be manipulated in more meaningful ways. They can be color-coded with multiple colors. They might also take the form of images, whether a quick sketch, a photograph, or other useful bit of visual information. In the real world, an author will use whatever material best suits the information to be conveyed. The only limitations are related to being physical: portability, duplication, and so on. Unfortunately, this model consistently fails to solve some of those very problems. They fail to make use of the advantages of using a computer program instead of actual notecards.

Furthermore, the model these programs adopt is minimally commital, with only one or two components being related to the real world, while the rest are unrelated to one another. The model gives no clear idea of the functionality of its components.

Instead, I propose a program with a model based around the night sky.

Just looking at the night sky, you might see a mess of little lights: stars, planets, various celestial bodies. These lights (we’ll say stars for simplicity) have no immediately apparent organizational structure. How can one ever learn to consistently identify specific stars, transform the mess of lights into useful information?

The solution to this problem is ancient, yet still applicable to modern life: constellations.

By connecting and making pictures out of patterns of lights, humans have been able to chart the night sky in ways that are memorable and meaningful to even those with only passing interest in the celestial bodies. Furthermore, stars can be part of multiple, overlapping constellations—being a member of one grouping does not prevent it from being part of another.

How does this map to creative writing?

Imagine a story that involves multiple narrator characters. One way to look at the story is how it will appear in the story’s final, written form: a series of events, perhaps presented non-chronologically, from a variety of narrators. But perhaps, as the author creates the story, they want to look at the story as it happens chronologically. Or perhaps they want to examine each character’s part as separate from the others’. Or perhaps the writer wants to group scenes by their locations. All of these are perfectly valid ways to organize the same set of documents, yet in most creative writing software, attempting to create a new organization either destroys what existed previously or creates a lot of needless duplication.

Therefore, I propose software that, like Code Bubbles, allows for snippets of writing to be intuitively grouped, but unlike Code Bubbles, allows for multiple, overlapping organization schemes. The night sky model provides an intuitive interface metaphor that will encourage ease of understanding and use.

Terminology:

Stars - notes/nodes/vertices
Clusters - multiple stars collapsed into a smaller representation
Constellations - arrangements/relationships/networks

Components

Stars

Stars function much like you would expect notes to, but can actually have a range of uses. A Star might consist of:

a snippet of writing
a character profile
a scene
notes about a scene
a setting
an image
a quote
an event
a link
a piece of audio or video

Constellations

Constellations operate much like Code Bubbles’ bubbles, but multiple can be defined from the same set of Stars. Grouping will be available both in terms of an outline that encompasses the component Stars, as in the graphical representation of a constellation in real like, and in network-like edges between Stars (nodes). This can be used to create series of events, as in a chronological or diegetic order, while having simultaneously associated but “orderless” elements.

Constellations will be given names and colors, to allow them to be easily distinguished from one another in a selection menu.

Clusters

For simplicity, it is advisable that groups of Stars be collapsible. For example, a group of Stars might consist of notes related to a character— perhaps one Star is a profile, others are images of the character, and so on. Perhaps the author wants to include all the character notes in a Constellation that contains notes on all the characters. Including all the notes on this character at the “top level” in this Constellation would make it difficult to understand the relationship between all the Stars—notes on this character are not directly related to notes on another character. Instead, these Stars should be embeddable into a Cluster that represents the character. Then is is possible to have a Constellation of all the characters, from which each Cluster can be expanded into its component Stars.

Other features

small ‘sky map’ of all inhabited parts of the virtual field
search across all snippets
name/character generator
document statistics (word counts, etc)
selection of sky/star themed backgrounds will help give the software a modern look
bare-bones editor mode for focused, long-form writing

Miscellanea

Working titles for this software design include:

Constellate / Constellations
Celestial
Sky Writer
Written in the Stars

Some Fun with JQuery : Lists & Links

Mon, 17 Nov 2014

Inspiration

My afternoon project for last Friday happened to be my first ever endeavor into JQuery, and among my first uses of Javascript. Since seeing the elegant use of collapsing/expanding lists for the demonstration of a news summarization system, I had fallen in love with this strategy for representing hierarchical data (in Summa’s case, increasingly specific summarizations). At the same time, I was looking for a way to augment my resume page; a way to add more information without cluttering the page. Eventually hit upon the idea of combining these two ideas.

A single page resume is nice, but somewhat negates the point of creating a webpage—why not just post the .pdf (which I also do), if it’s not going to add anything else? My resume is one page of things I think will be most relevant to a position I am interested in. During a recent chat with a recruiter, I realized that the skills I chose not to include may be important, too. In this case, my training the Linux/Unix systems, which has been pushed off my resume in favor of an NLP/Machine Learning focus, was just the ticket to show that I had the skills the job required. My goal with my online resume, then, was to highlight certain things —particularly recent projects and things I’m most proud of— while allowing for further exploration and delving into everything I have to offer.

Selectively Collapsing Lists

Creating collapsing/expanding lists was mostly a matter of following jasalguero’s tutorial, which works quite admirably. However, the page created by this tutorial loads with all lists collapsed. The “expand all” and “collapse all” buttons provide a detailed view and sparse overview, respectively. I wanted something in the middle, a “one page summary” by default, which could then be expanded or collapsed at will.

To do this, I added a class that I could use to manually mark highlights, or things that would be expanded by default. Since the page doesn’t include any content that might change, it creates lists of “highlights” and “lowlights” (everything but highlights) on loading. Collapsed style is then added to every element of lowlights, and both collapsed and expanded styles are added to highlights. This allows highlights to maintain proper behavior when expanding is toggled. Full code for this can be found in my resume repo.

Differing Behavior for Anchor (fragment) and Outgoing Links

Because of the way click events are handled by the above tutorial, they must be explicitly re-enabled in the script (which, to jasalguero’s credit, is explained in the tutorial). However, solution provided would cause anchor links to open in a new window/tab without actually focusing the page to the anchor. What I needed was to specify one behavior for anchor links and one behavior for outgoing links. Although I saw plenty of similar questions online, I did not see any answers that fit my specific case. Since I wasn’t able to find a clear answer anywhere, here is my solution (minus aspects needed for collapsing/expanding elements):

$('a').unbind('click').click(function(){
    var link = $(this).attr('href');
    var fragment = link.split('#')[1];
    if ( fragment ) {
        fragment = $('[name="' + link.substr(1) + '"]');
        $( root ).animate({
            scrollTop: $( fragment ).offset().top
        }, 500);
    } else {
        window.open( link );
    }
    return false;
});

Someone with better knowledge of JQuery might be able to produce a more elegant solution, but this seems to work.

Running and Testing an IRC Bot Offline

Tue, 04 Nov 2014

Want to write an irc bot without getting kicked off your favorite server during testing? Not to mention be able to play with it while offline—after all, you shouldn’t have to connect to the internet just to test your chat bot. Recently I was recommended to use Charybdis to set up a local irc server for testing. However, I quickly found a simpler solution, one that’s more or less plug-and-play, with minimal initial setup.

This article assumes a Linux-like operating system for specific instructions on how to run certain commands, but it should be possible to use Mac OS X. As such, some commands may vary.

ngIRCd

Prompted by a Physics student teacher’s post about setting up a local IRC server for his students to use, I decided to look into ngIRCd.

Installation is easy enough:

apt-get install ngircd

(You may need to use ‘sudo’)

He goes into slightly more depth about configuring ngird, which you can do by editting the configurations in /etc/ngircd/ngirdc.conf if you like; for simple bot testing, I found this necessary. After installing, simply run

ngirdc

in a terminal to start it. It will look like nothing happened, but you will now be able to connect to your local server using

irssi -c localhost

or whatever your favorite irc client is.

You can stop it at any time by calling

/etc/init.d/ngircd stop

I believe that it will run every time the box on which it’s run is turned on (meaning that shutting down or restarting will only stop ngIRCd while the box is off), though I have not tested that extensively. You can tell if it is running my executing

pidof ngircd

in a terminal. If it returns a pid (a number), then ngircd is running. You can also use this number to kill the job, but there is no reason to do that instead of the stop command above.

Now that the local IRC server is set up, you can use it to test your irc bot by connecting it to localhost.

A Little Bit of Troubleshooting

If you notice that your bot doesn’t seem to be connecting and are extending Twisted’s irc.IRCClient, consider adding

def dataReceived(self, bytes):
        print repr(bytes)
        return irc.IRCClient.dataReceived(self, bytes)

to your bot’s code. This will let you see all the data your bot receives, and may help with troubleshooting a bad connection. For example, when I first tried to connect Promptbot to localhost, it never showed up in the default channel, nor even on the local network. Once I added the above code, I was able to see that it was getting the following message:

ERROR :Access denied: Bad password?

This happened because I had set Promptbot up with a default nick and password. Since no password was configured for the server, it was being rejected for even trying to use a password at all. Once I set the default password to null, it was able to connect, and I was able to test my bot to my heart’s content.

Need help troubleshooting? Feel free to contact me! I’m always open for questions… especially related to Promptbot/irc bots!

New NLP-ish Repo

Tue, 28 Oct 2014

Curious about what I worked on over the summer? Check out my new, elegantly-named repo: https://github.com/konahart/relation-extraction-pipeline

I decided to open source my work because a) my bosses had no problem with it (i.e., “because I can”) and b) I believe there are parts which may be more widely useful, such as:

GigawordCorpusHandler, which parses the XGML structure given by LCD's Gigaword Corpus (consistent across English, Spanish, and Chinese);
CoreNLPProcessor, which uses Stanford's CoreNLP to perform tokenization, NER, and POS annotation (although not the most efficiently... more on that later); and
Utils, which provides a function to check whether a file is gzipped, then returns the appropriate InputStream (useful for dealing with large corpora like Gigaword, but not having to gzip all files).

In the coming months I’ll likely work on breaking them out into their own, useful little repos, but since the code runs, I might as well make it available now. Enjoy!