(redirected from PrantedMutter.Sketches)
On this page... (hide)
- 1. the skinny
- 2. the sketchy
- 3. Notes
- 4. ideas
- 5. Online Repo
- 6. See Also
- 7. Tags
- 8. Comments
- 8.1 TAdAlaFIL 20 mg
- 8.2 ‘
- 8.3 ’
- 9. Add Comment
1. the skinny
I’ve been making some [visual|web|epoetry] sketches.
Sketch because they are not necessarily complete, finished works.
Instead, they are tests, experiments, trials.
I’m making them and tweaking them, so they aren’t necessarily firmly fixed.
But once I get to where I think I’m going, I should move on to another sketch.
These are experiments in both text+image, text-vs-image, text, web, javascript, html, or G-d-knows-what.
These are not designed to show a mastery of html, javascript, jQuery, css, or any other technology. Rather, they are designed to present texts, and a familiarity with the above technologies. I hope to get some sort of good coding practices inside of them, but please be aware that these are sketches -- experimental quick takes, and code-reuse and perfection is not the end-goal.
The libraries I use are generally served up from my own server, instead of a CDN. This is mostly for personal reasons, as I tend to have caching turned off in my development browsers for development reasons. And I don’t expect a large server-load anyway.
2. the sketchy
when in doubt, click-n-drag, or hit the spacebar
Sketch:001 - my original idea was that most sketches would look like this.
Sketch:002 - iteration 1 wouldn’t work in Fire Fox; this is essentially iteration 2. I’d like some more control over stacking.
Sketch:006 - A little visual play, and obscuring some text.
Sketch:007 - each character of the center text can be re-arranged using gridster.js. Not perfect. Interesting tool.
?speed=n
to redefine the speed).
engine={markov|cento|overlap}
to specify the engine (defaults to markov), ngram={1..n}
for length, and content={raw|material|test}
for three different text sources (defaults to raw).
NOTE: the HTML file contains two entire gutenberg e-texts shoved into it, so it takes a while to load; regenerate with r
instead of F5.
If those two files were includes, they would be cached better. (they should be anyway, no? Maybe I’ve turned off caching in my browser again. argh.)
clearstorage=true
which... clears local storage. NOTE: since the param is not removed, refreshing this URL after editing will ONCE AGAIN clear all changes you’ve made.
<space>
to load a new SFX + image. If nothing appears, image might be taking a long-time to reload. It would be nice if there was a method to go back to previous images.... a local history.
Mouse click and drag to paint (previous paints will fade slightly).
Color and size are based on mouse position.
SPACE to paint without fading previous actions.
RIGHT/LEFT to increase/decrease rotation of letters.
R to reset rotation to 0.
UP/DOWN to change paint mode.
M to switch between grids and circles
Delete or Backspace to clear the screen.
S to Save. [not currently working]
Sketch 27 has not yet launched.
3. Notes
- Files are named with numbers, to avoid the the implications of a title both during and after development.
- sketches are usually given an internal title. This usually appears during development.
- The code should be reasonably good code. But not astronaut-architected.
- The simplest thing that can possibly work
- If I codify some practices (display, js, etc) I may go back and integrate them into earlier pieces. Currently, there is not much shared js or css.
- When I look at some of this code, I cringe. I wrote it a couple of weeks ago. UGH. But they are sketches, not finished artworks.
- Some ideas are coalescing into a library.
4. ideas
in-page info, that can be hidden easily, and recalled easily. hrm.
(Perl?) based landing page, that auto-indexed available documents
Some sort of hover-area popup that contains popup-box-links for notes, citations, inspiration, etc. And/or links to related or prev/next works.
Something with scrapings from the dictionary of reduplicated words? - http://www.allusional.info/dictRedup/wiki/DictionaryEntries
Have to munge the scrape into a parseable, usable format.
And then.... what????
Use Content Editable combined with Local Storage to allow for in-browser editing by the viewer, with storage of edits that are restorable
NOTE: this required further finessing with scenarios such as that in Sketch:011, as the rendered text is not a static element, but embedded by JS from an array of texts. The changes would have to be pushed back to the array
The storage example uses a blur-event to trigger storage, but mor finessing will be needed, as any bound keys affect the animation would have to fire storage; or perhaps be disabled in some manner. The space-key, is the most obvious issue, since that resumes animation.....
OtherMichael February 15, 2013, at 03:39 PM
inspired by (not-working-in-Firefox) code in bgrin’s comment @ https://coderwall.com/p/lhsrcq
It _does_ work in Chrome, though, so you can test it out.
As one types, the background (slowly) changes.
But.... why would the user be typing in such an implementation?
There needs to be some sort of invitation, and a payoff.
And some other effect has to happen.
the text changes as one types.
Which reminds me, there was a net.art word “processor” that did this at some point, I think....
OtherMichael March 11, 2013, at 02:49 PM
http://jukkapekkakervinen.blogspot.com/2010/08/diitdiit.html - three columns, the first and third scrolling themselves (a text gyre). The central column static, or on-click change.
Partially realized in 007
http://ricostacruz.com/jquery.transit/ SCALE -- text expands (and grows transparent) on-hover
Just one or two (or three or something short) large words on-screen at a time.
Transitions via Airport
Modified airport. I don’t like how the length keeps changing due to the proportional spacing of the intermediate forms. A “real” airport display is fixed-width tiles.
I like the idea of interactivity. Reading as a game.
But not so far down the rabbit hole as InteractiveFiction
A Markov chainer. No need for an intake engine -- nobody will be dynamically/interactively providing source-texts. I (ahem) will decide that ahead of time. Some application (probably TextMunger) will digest text and excrete in some format.
The web-page code (js, presumably) will loop through that.
this way, each page can theoretically have new text, but w/o the overhead of all of that pre-processing. Output takes some time, but nowhere near the time of first munching.
OtherMichael February 15, 2013, at 03:49 PM Partially realized in Sketch17 The engine-work is ongoing.
Every few seconds, an individual (at random) character in the text runs through a randomization-sequence, blurring through the chars. And back to the original char.
Alternatively, all chars will be randomized at this rate until ALL are; the process then reverses.
Another block of text remains unchanged.
Tiles of text (words) fly away from the cursor, thus re-organizing the text, without allowing direct click-n-drag control. By avoiding the reader, the text is re-aligned.
The text is readable, but in opposition to the reader?
Reactive to, anyway.
Not the reader’s gaze, unfortunately.
http://ianli.com/infinitedrag/ tiles are markov-generated from a pre-existing map. new tiles are manufactured as scrolled.
BONUS: extra algorithm to have some sort of matching between the tile edges.
Or is that the usual “exercise for the reader” where they make up patterns where none were “intended” ?
OtherMichael February 15, 2013, at 03:49 PM
Bonus 2: once tiles are generated, they are dumped into Local Storage?.
So subsequent visits maintain a map of pre-explored space, allowing the viewer-author to continue to write new areas of the map.
If there was more feedback between what has already been generated and what is generated next, that gives a greater reason to return.
Not just increased complexity (because that would have some sort of diminishing return). Some other increasing/complication metric
Bonus 3: tiles are editable
More color play (as in 002)
OtherMichael February 15, 2013, at 03:49 PM other color comes in with 005 010 016 017
texts start out same color as background (which is... black)
as you approach a text, it becomes visible, but fades as you move away - using the “opacity of multiple elements” option from this jQuery Approach plugin
(non-linkable, non-default demo; select from dropdown under demos)
I tried this, and the plugin was unworkable for my large dataset (200-300 text pieces).
text shuffles itself as you watch
the sense/nonsense re-orgs @ jhave-about using jquery-easing is a nice effect
5. Online Repo
See the code online @ https://github.com/MichaelPaulukonis/WebText
Processing.js sketches have original versions @ https://github.com/MichaelPaulukonis/processing
6. See Also
TextMunger
ElectroText
ConcretePoetry
ElectroPoetics
WritingMachines
Processing
BotProjects
7. Tags
8. Comments
9. Add Comment