#graphics

63 bookmarks tagged with #graphics · RSS Feed · ← All Tags

Graphics livecoding in Common Lisp

https://kevingal.com/blog/cl-livecoding.html
Some Lisps, like Common Lisp, have a powerful feature that tends to go underappreciated amidst all the talk about macros: the ability to recompile your program while it's running, without restarting it. For the purposes of this post, and because it sounds cool, let's call this ability livecoding

wrightwriter/Bonzomatic-Compute: Live shader coding tool and Shader Showdown workhorse

https://github.com/wrightwriter/Bonzomatic-Compute
This is a live-coding tool, where you can write a 2D fragment/pixel shader while it is running in the background. It's a fork of Bonzomatic that add network communication (WebSocket Server). The goal is to send a shader as text across a network and receive it somewhere else for display. The shader is send when you ask for compilation (ctrl+r) and also at regular updates (interval can be set in config.json) Bonzomatic can be launched as "sender" or as "grabber" if you want to send your shader or visualize a distant shader.

About | Skia Canvas

https://skia-canvas.org/
Skia Canvas is a browser-less implementation of the HTML Canvas drawing API for Node.js. It is based on Google’s Skia graphics engine and, accordingly, produces very similar results to Chrome’s <canvas> element. The library is well suited for use on desktop machines where you can render hardware-accelerated graphics to a window and on the server where it can output a variety of image formats.

The Art of Dithering and Retro Shading for the Web - Maxime Heckel's Blog

https://blog.maximeheckel.com/posts/the-art-of-dithering-and-retro-shading-web/
Highlight:In this article, I hope to convince you of the power of post-processing effects and that nothing beats an elegant retro vibe applied to a website 👌✨. We'll also look into examples of dithering and pixel art from very talented folks who use the same processes that I'll be introducing later on, as well as some of my own creations that I built while learning about all this. A detailed walkthrough of the inner workings of dithering and other shading techniques to give a retro look and feel to your WebGL and React Three Fiber work.

The Fall and Rise of SVG

http://blog.siliconpublishing.com/2015/12/the-fall-and-rise-of-svg
Now that SVG is widely supported and native to browsers, the art of using it is more connected to the surrounding web technologies that it can now interoperate with in HTML5

Imperfect Circles – Aesthetic imperfection with fractal subdivision | Rectangle World – HTML5 Canvas and JavaScript: Tutorials and Experiments

http://rectangleworld.com/blog/archives/413
Getting a computer to draw a shape in the way that a human would requires programming in some imperfection. The simple idea is to add in some randomization of drawing coordinates, which could be done in various ways. Below are two examples of imperfect circles drawn in an HTML5 canvas with JavaScript, where the imperfection has been added through the use of a fractal-like subdivision algorithm. The imperfection can be subtle, but it is enough to make the image appear to be human-drawn. Although the images are quite simple I find them quite nice to look at.

WidgetWorx > SpriteLib

http://www.widgetworx.com/widgetworx/portfolio/spritelib.html
SpriteLib is a collection of static and animated graphic objects (also commonly known as sprites). It was created to provide hobbyist game developers with an assortment of images to use in their creations. Because of SpriteLib, developers don't have to waste precious time or money creating graphics from scratch.

Pixel-fitting by Dustin Curtis

http://dcurt.is/pixel-fitting
The difference is subtle, but the comparison makes it very clear. There are several major problems with the computer-created icons that leaves them looking blurry and unimpressive. For example, in the transition from 66x40 to 48x30 pixels, the human version drops the border down to exactly 2 pixels but the computer drops it to 2.8 (that's two solid black pixels, plus one half-pixel at 80% intensity), which gives it an incorrect soft edge. The computer has no way of knowing that the border should always be sharp, so it ignorantly tries to maintain the ratio of the originally-specified image at the expense of sharpness. The result is not great.

bl.ocks.org - 1377729 - Force-based label placement

http://bl.ocks.org/1377729
A small demo of a pleasant, yet simple label placement algorithm for densely packed visualizations. The basic idea is to have labels orbit around their target node at a fixed distance, but repeal each other, so that they don't overlap, and orient themselves to the outside of clusters. To support that, labels on the right of their target node are left-aligned, and labels on the left of their target node are right-aligned; in between, we interpolate. In this example, one force layout governs the node placement, and the second one the label placement, but of course, the node placement could be computed by any other algorithm.

jtnimoy: The Work of Josh Nimoy

http://jtnimoy.net/?q=178
I spent a half year writing software art to generate special effects for Tron Legacy, working at Digital Domain with Bradley "GMUNK" Munkowitz, Jake Sargeant, and David "dlew" Lewandowski. This page has taken a long time to be published because I've had to await clearance. A lot of my team's work was done using Adobe software and Cinema 4D. The rest of it got written in C++ using OpenFrameworks and wxWidgets, the way I've always done it with this team ;) Uniquely however, Digital Domain's CG artists were able to port my apps over to Houdini for further evolution and better rendering than OpenGL could ever provide. Special thanks to Andy King for showing me that what seasoned CG artists do at DD is actually not so far off from what's going on in the Processing community.

Countercomplex: Defining Computationally Minimal Art (Or, taking the "8" out of "8-Bit")

http://www.pelulamu.net/countercomplex/computationally-minimal-art
"The defining element is LOW COMPUTATIONAL COMPLEXITY, as expressed in all aspects of the audiovisual system: the complexity of the platform (i.e. the number of transistors or logic gates in the hardware), the complexity of the software (i.e. the length in bits of the program code and static data), as well as the time complexity (i.e. how many state changes the computational tasks require). A more theoretical approach would eliminate the differentiation of software and hardware and talk about description/program length, memory complexity and time complexity."

ANSI lives! Viewtronics, Flash Player 10 textmode viewer - peter nitsch.net

http://www.peternitsch.net/blog?p=618
"The best things in life are often silly, and in this case gloriously retro. Blocktronics, a collective of the best textmode artists around the world, have released their second art pack entitled “Codename Chris Wirth” in homage to the legendary ANSI artist RaD Man. No, it’s not 1995, and yes, this kind of art is still being produced in stunning fashion. "

Accessibility is a harsh mistress [dive into mark]

http://diveintomark.org/archives/2009/03/21/accessibility-is-a-harsh-mistress
"When I was an accessibility architect at IBM, I assisted in the final stages of ensuring that Eclipse’s Graphical Editing Framework was fully accessible to blind people. ... During one particularly difficult teleconference, an Eclipse developer muttered something like, “You realize no one is ever actually going to do any of this, right?” There was an awkward silence as the people who had spent their lives in the trenches of access enablement contemplated the very real possibility that no one would ever benefit from their work."

google hut

http://www.google.com/search?hl=en&q=%E2%96%91%E2%96%91%E2%96%93%E2%96%88%E2%96%93%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%84%E2%96%88%E2%96%84%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%92%E2%96%93%E2%96%92%E2%96%91%E2%96%92+%E2%96%91%E2%96%93%E2%96%88%E2%96%88%E2%96%88%E2%96%93%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%84%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%84%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%92%E2%96%92%E2%96%92%E2%96%91%E2%96%91%E2%96%91%E2%96%92%E2%96%92%E2%96%91%E2%96%91%E2%96%92%E2%96%92%E2%96%92%E2%96%92%E2%96%92+%E2%96%91%E2%96%91%E2%96%93%E2%96%88%E2%96%93%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%93%E2%96%88%E2%96%88%E2%96%88%E2%96%92%E2%96%92%E2%96%92%E2%96%91%E2%96%91%E2%96%92%E2%96%92%E2%96%92%E2%96%93%E2%96%92%E2%96%93%E2%96%92%E2%96%93%E2%96%92+%E2%96%91%E2%96%91%E2%96%91%E2%96%93%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%88%E2%96%93%E2%96%93%E2%96%93%E2%96%93%E2%96%93%E2%96%88%E2%96%91%E2%96%92%E2%96%92%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%84%E2%96%92%E2%96%91%E2%96%92%E2%96%92%E2%96%92%E2%96%92%E2%96%92%E2%96%92%E2%96%92%E2%96%92%E2%96%92%E2%96%92+%E2%96%88%E2%96%88%E2%96%88%E2%96%93%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%93%E2%96%93%E2%96%88%E2%96%93%E2%96%93%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%93%E2%96%88%E2%96%88%E2%96%93%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88%E2%96%88
drawing with funky characters on Google