the other side of go: programming pictures
DESCRIPTION
The talk is "The Other Side of Go: Programming Pictures", and will concentrate on design from two aspects: API design and visual design, using examples from these packages: SVGo (generation of SVG), OpenVG (hardware accelerated Graphics on the Raspberry Pi), Deck (presentations), and Gift (command line interface to the Go Image Filtering Toolkit). Along the way we'll explore generating visuals from data (your own as well as the Internet data), generative Art, diagramming, the design of presentations, and image manipulation.TRANSCRIPT
![Page 1: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/1.jpg)
The other side of Go
Programming Pictures
Anthony Starks
![Page 2: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/2.jpg)
Go is great in the back end
![Page 3: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/3.jpg)
But sometimes it's about the picture
![Page 4: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/4.jpg)
Picasso Turing
![Page 5: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/5.jpg)
API Design
Client Program Design
Visual Design and Relationships
![Page 6: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/6.jpg)
![Page 7: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/7.jpg)
![Page 8: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/8.jpg)
Element Arguments
Rect (100,200,250,125)
<rect x="100" y="200" width="250" height="125"/>
(100, 200)
250
125
![Page 9: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/9.jpg)
Element Arguments CSS Style
Rect (100,200,250,125, "fill:gray;stroke:blue")
<rect x="100" y="200" width="250" height="125"style="fill:gray;stroke:blue"/>
(100, 200)
250
125
![Page 10: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/10.jpg)
Element Arguments Attributes
Rect (100,200,250,125,`id="box"`, `fill="gray"`, `stroke="blue"`)
<rect x="100" y="200" width="250" height="125"id="box" fill="gray" stroke="blue"/>
(100, 200)
250
125
![Page 11: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/11.jpg)
![Page 12: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/12.jpg)
Scale
Roundrect Circle
Line Rect
Line
Arc
fill:rgb(164,198,57)
![Page 13: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/13.jpg)
package main
import ( "os" "github.com/ajstarks/svgo")
func main() { width := 600 height := 338 canvas := svg.New(os.Stdout) canvas.Start(width, height) canvas.Rect(0, 0, width, height, "fill:black") canvas.Circle(width/2, height, width/2, "fill:rgb(44,77,232)") canvas.Text(width/2, height/2, "hello, world", "fill:white;font-size:60pt;font-family:serif;text-anchor:middle") canvas.End()}
![Page 14: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/14.jpg)
package main
import ( "github.com/ajstarks/svgo" "log" "net/http" "strings")
const defaultstyle = "fill:rgb(127,0,0)"
func main() { http.Handle("/circle/", http.HandlerFunc(circle)) err := http.ListenAndServe("localhost:1958", nil) if err != nil { log.Println("ListenAndServe:", err) }}
func circle(w http.ResponseWriter, req *http.Request) { w.Header().Set("Content-Type", "image/svg+xml") s := svg.New(w) s.Start(500, 500) s.Title("Circle") s.Circle(250, 250, 125, shapestyle(req.URL.Path)) s.End()}
func shapestyle(path string) string { i := strings.LastIndex(path, "/") + 1 if i > 0 && len(path[i:]) > 0 { return "fill:" + path[i:] } return defaultstyle}
![Page 15: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/15.jpg)
Read/Parse/Draw Pattern
![Page 16: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/16.jpg)
Data
Picture
<thing top="100" left="100" sep="100"> <item width="50" height="50" name="Little" color="blue">This is small</item> <item width="75" height="100" name="Med" color="green">This is medium</item> <item width="100" height="200" name="Big" color="red">This is large</item></thing>
![Page 17: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/17.jpg)
package main
// Importsimport ( "encoding/xml" "flag" "fmt" "io" "os" "github.com/ajstarks/svgo")
type Thing struct { Top int `xml:"top,attr"` Left int `xml:"left,attr"` Sep int `xml:"sep,attr"` Item []item `xml:"item"`}
type item struct { Width int `xml:"width,attr"` Height int `xml:"height,attr"` Name string `xml:"name,attr"` Color string `xml:"color,attr"` Text string `xml:",chardata"`}
var ( width = flag.Int("w", 1024, "width") height = flag.Int("h", 768, "height") canvas = svg.New(os.Stdout))
// Open the filefunc dothing(location string) { f, err := os.Open(location) if err != nil { fmt.Fprintf(os.Stderr, "%v\n", err) return } defer f.Close() readthing(f)}
// Read the file, loading the defined structurefunc readthing(r io.Reader) { var t Thing if err := xml.NewDecoder(r).Decode(&t); err != nil { fmt.Fprintf(os.Stderr, "%v\n", err) return } drawthing(t)}
// use the items of "thing" to make the picturefunc drawthing(t Thing) { x := t.Left y := t.Top for _, v := range t.Item { style := fmt.Sprintf("font-size:%dpx;fill:%s", v.Width/2, v.Color) canvas.Circle(x, y, v.Height/4, "fill:"+v.Color) canvas.Text(x+t.Sep, y, v.Name+":"+v.Text+"/"+v.Color, style) y += v.Height }}
func main() { flag.Parse() for _, f := range flag.Args() { canvas.Start(*width, *height) dothing(f) canvas.End() }}
Imports
Define the input data structures
Define flags and output destination
Read the input
Parse and load the data structures
Draw
Main
![Page 18: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/18.jpg)
Imports
import ( "encoding/xml" "flag" "fmt" "io" "os"
"github.com/ajstarks/svgo")
![Page 19: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/19.jpg)
The main
func main() { flag.Parse() for _, f := range flag.Args() { canvas.Start(*width, *height) dothing(f) canvas.End() }}
![Page 20: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/20.jpg)
Define the input data structures
<thing top="100" left="100" sep="100"> <item width="50" height="50" name="Little" color="blue">This is small</item> <item width="75" height="100" name="Med" color="green">This is medium</item> <item width="100" height="200" name="Big" color="red">This is large</item></thing>
type Thing struct { Top int `xml:"top,attr"` Left int `xml:"left,attr"` Sep int `xml:"sep,attr"` Item []item `xml:"item"`}
type item struct { Width int `xml:"width,attr"` Height int `xml:"height,attr"` Name string `xml:"name,attr"` Color string `xml:"color,attr"` Text string `xml:",chardata"`}
![Page 21: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/21.jpg)
Define flags and output destination
var ( width = flag.Int("w", 1024, "width") height = flag.Int("h", 768, "height") canvas = svg.New(os.Stdout))
![Page 22: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/22.jpg)
Read the input
func dothing(location string) { f, err := os.Open(location) if err != nil { fmt.Fprintf(os.Stderr, "%v\n", err) return } defer f.Close() readthing(f)}
![Page 23: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/23.jpg)
Parse and load the data structures
func readthing(r io.Reader) { var t Thing if err := xml.NewDecoder(r).Decode(&t); err != nil { fmt.Fprintf(os.Stderr, "%v\n", err) return } drawthing(t)}
![Page 24: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/24.jpg)
Use the items of "thing" to make the picture
func drawthing(t Thing) { x := t.Left y := t.Top for _, v := range t.Item { style := fmt.Sprintf("font-size:%dpx;fill:%s", v.Width/2, v.Color) canvas.Circle(x, y, v.Height/4, "fill:"+v.Color) canvas.Text(x+t.Sep, y, v.Name+":"+v.Text+"/"+v.Color, style) y += v.Height }}
![Page 25: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/25.jpg)
![Page 26: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/26.jpg)
pmap -stagger -showtitle -p -t "Browser Market Share" bs.xml
<pmap> <pdata legend="StatCounter"> <item value="51.3">Chrome</item> <item value="21.3">Internet Explorer</item> <item value="18.8">Firefox</item> <item value="5.1">Safari</item> <item value="2.1">Other</item> <item value="1.4">Opera</item> </pdata>...</pmap>
![Page 27: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/27.jpg)
SVGo Clients
![Page 28: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/28.jpg)
![Page 29: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/29.jpg)
![Page 30: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/30.jpg)
![Page 31: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/31.jpg)
![Page 32: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/32.jpg)
![Page 33: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/33.jpg)
![Page 34: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/34.jpg)
![Page 35: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/35.jpg)
![Page 36: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/36.jpg)
![Page 37: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/37.jpg)
![Page 38: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/38.jpg)
![Page 39: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/39.jpg)
f50 sunsethttps://api.flickr.com/services/rest/ ?method=flickr.photos.search &api_key=... &text=sunset &per_page=50 &sort=interestingness-desc
<?xml version="1.0" encoding="utf-8" ?><rsp stat="ok"> <photos page="1" pages="105615" perpage="50" total="5280747"> <photo id="4671838925" ... secret="b070f3363e" server="4068" farm="5 ... /> <photo id="3590142202" ... secret="c46752e4d8" server="2441" farm="3" .../> ... </photos> </rsp>
![Page 40: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/40.jpg)
![Page 41: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/41.jpg)
ti = 15
ti = 30
ti = 45
package main
import ( "os" "github.com/ajstarks/svgo")
func main() {
width := 200 height := 200 a := 1.0 ai := 0.03 ti := 15.0
canvas := svg.New(os.Stdout) canvas.Start(width, height) canvas.Rect(0, 0, width, height) canvas.Gstyle("font-family:serif;font-size:100pt")
for t := 0.0; t <= 360.0; t += ti { canvas.TranslateRotate(width/2, height/2, t) canvas.Text(0, 0, "i", canvas.RGBA(255, 255, 255, a)) canvas.Gend() a -= ai } canvas.Gend() canvas.End()}
![Page 42: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/42.jpg)
openvg
![Page 43: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/43.jpg)
package main
import ( "bufio" "github.com/ajstarks/openvg" "os")
func main() { width, height := openvg.Init()
w2 := openvg.VGfloat(width / 2) h2 := openvg.VGfloat(height / 2) w := openvg.VGfloat(width)
openvg.Start(width, height) // Start the picture openvg.BackgroundColor("black") // Black background openvg.FillRGB(44, 100, 232, 1) // Big blue marble openvg.Circle(w2, 0, w) // The "world" openvg.FillColor("white") // White text openvg.TextMid(w2, h2, "hello, world", "serif", width/10) // Greetings openvg.End() // End the picture bufio.NewReader(os.Stdin).ReadBytes('\n') // Pause until [RETURN] openvg.Finish() // Graphics cleanup}
![Page 44: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/44.jpg)
Openvg FunctionsCircle
Ellipse
Rect
Roundrect
Line
Polyline
Polygon
Arc
Qbezier
Cbezier
Image
Text
TextMid
TextEnd
(x, y, r VGfloat)
(x, y, w, h VGfloat)
(x, y, w, h VGfloat)
(x, y, w, h, rw, rh VGfloat)
(x1, y1, x2, y2 VGfloat)
(x, y []VGfloat)
(x, y []VGfloat)
(x, y, w, h, sa, aext VGfloat)
(sx, sy, cx, cy, ex, ey VGfloat)
(sx, sy, cx, cy, px, py, ex, ey VGfloat)
(x, y VGfloat, w, h int, s string)
(x, y VGfloat, s string, font string, size int)
(x, y VGfloat, s string, font string, size int)
(x, y VGfloat, s string, font string, size int)
![Page 45: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/45.jpg)
Decka Go package for presentations
![Page 46: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/46.jpg)
Anatomy of a Deck
<deck>
<canvas width="1024" height="768" />
<slide bg="white" fg="black">
<image xp="70" yp="60" width="256" height="179" name="work.png" caption="Desk"/>
<text xp="20" yp="80" sp="3" link="http://goo.gl/Wm05Ex">Deck elements</text>
<list xp="20" yp="70" sp="2" type="bullet">
<li>text, list, image</li>
<li>line, rect, ellipse</li>
<li>arc, curve, polygon</li>
</list>
<line xp1="20" yp1="10" xp2="30" yp2="10"/>
<rect xp="35" yp="10" wp="4" hr="75" color="rgb(127,0,0)"/>
<ellipse xp="45" yp="10" wp="4" hr="75" color="rgb(0,127,0)"/>
<arc xp="55" yp="10" wp="4" hp="3" a1="0" a2="180" color="rgb(0,0,127)"/>
<curve xp1="60" yp1="10" xp2="75" yp2="20" xp3="70" yp3="10" />
<polygon xc=75 75 80" yc="8 12 10" color="rgb(0,0,127)"/>
</slide>
</deck>
Start the deck
Set the canvas size
Begin a slide
Place an image
Draw some text
Make a bullet list
End the list
Draw a line
Draw a rectangle
Draw an ellipse
Draw an arc
Draw a quadratic bezier
Draw a polygon
End the slide
End of the deck
![Page 48: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/48.jpg)
Percent Grid
10 20 30 40 50 60 70 80 90
10
20
30
40
50
60
70
80
90
![Page 49: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/49.jpg)
Percentage-based layout
Hello
10%, 50% 50%, 50% 90%, 50%
![Page 50: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/50.jpg)
Scaling the canvas
Landscape Portrait
![Page 51: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/51.jpg)
Process deck code
interactive
SVG
![Page 52: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/52.jpg)
NewSlides (where io.Writer, w, h int)
StartDeck()/EndDeck()
StartSlide (colors ...string) EndSlide()
Arc (x, y, w, h, size, a1, a2 float64, color string, opacity ...float64)
Circle (x, y, w float64, color string, opacity ...float64)
Code (x, y float64, s string, size, margin float64, color string, opacity ...float64)
Curve (x1, y1, x2, y2, x3, y3, size float64, color string, opacity ...float64)
Ellipse (x, y, w, h float64, color string, opacity ...float64)
Image (x, y float64, w, h int, name string)
Line (x1, y1, x2, y2, size float64, color string, opacity ...float64)
List (x, y, size float64, items []string, ltype, font, color string)
Polygon (x, y []float64, color string, opacity ...float64)
Rect (x, y, w, h float64, color string, opacity ...float64)
Square (x, y, w float64, color string, opacity ...float64)
Text (x, y float64, s, font string, size float64, color string, opacity ...float64)
TextBlock (x, y float64, s, font string, size, margin float64, color string, opacity ...float64)
TextEnd (x, y float64, s, font string, size float64, color string, opacity ...float64)
TextMid (x, y float64, s, font string, size float64, color string, opacity ...float64)
![Page 53: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/53.jpg)
package main
import ( "github.com/ajstarks/deck/generate" "os")
func main() { deck := generate.NewSlides(os.Stdout, 1600, 900) // 16x9 deck to standard output deck.StartDeck() // start the deck
// Text alignment deck.StartSlide("rgb(180,180,180)") deck.Text(50, 80, "Left", "sans", 10, "black") deck.TextMid(50, 50, "Center", "sans", 10, "gray") deck.TextEnd(50, 20, "Right", "sans", 10, "white") deck.Line(50, 100, 50, 0, 0.2, "black", 20) deck.EndSlide()
// List items := []string{"First", "Second", "Third", "Fourth", "Fifth"} deck.StartSlide() deck.Text(10, 90, "Important Items", "sans", 5, "") deck.List(10, 70, 4, items, "bullet", "sans", "red") deck.EndSlide()
// Picture with text annotation quote := "Yours is some tepid, off-brand, generic ‘cola’. " + "What I’m making is “Classic Coke”" person := "Heisenberg" deck.StartSlide("black", "white") deck.Image(50, 50, 1440, 900, "classic-coke.png") deck.TextBlock(10, 80, quote, "sans", 2.5, 30, "") deck.Text(65, 15, person, "sans", 1.2, "") deck.EndSlide()
deck.EndDeck() // end the deck}
![Page 54: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/54.jpg)
// Text alignmentdeck.StartSlide("rgb(180,180,180)")deck.Text(50, 80, "Left", "sans", 10, "black")deck.TextMid(50, 50, "Center", "sans", 10, "gray")deck.TextEnd(50, 20, "Right", "sans", 10, "white")deck.Line(50, 100, 50, 0, 0.2, "black", 20)deck.EndSlide()
![Page 55: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/55.jpg)
// Listitems := []string{"First", "Second", "Third", "Fourth", "Fifth"}deck.StartSlide()deck.Text(10, 90, "Important Items", "sans", 5, "")deck.List(10, 70, 4, items, "bullet", "sans", "red")deck.EndSlide()
![Page 56: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/56.jpg)
// Picture with text annotationquote := "Yours is some tepid, off-brand, generic ‘cola’. " + "What I’m making is “Classic Coke”"person := "Heisenberg"deck.StartSlide("black", "white")deck.Image(50, 50, 1440, 900, "classic-coke.png")deck.TextBlock(10, 80, quote, "sans", 2.5, 30, "")deck.Text(65, 15, person, "sans", 1.2, "")deck.EndSlide()
![Page 57: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/57.jpg)
# Designing for Peopletitle A View of User Experience: Designing for People Anthony Starks / [email protected] / @ajstarkssection Design gray whitecaption eames.png Ray Eames What works good is better than what looks good, because what works good lasts.
capgen slides.txt | pdfdeck ... > slides.pdf
![Page 58: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/58.jpg)
Design Examples
![Page 59: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/59.jpg)
Bottom
Top
Left Right
![Page 60: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/60.jpg)
10%
10%
30% 70%
![Page 61: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/61.jpg)
Footer (bottom 10%)
Header (top 10%)
Summary(30%)
Detail(70%)
![Page 62: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/62.jpg)
My Story
Section
A. Person, January 2015
One
Two
Three
Four
Five
Six
![Page 63: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/63.jpg)
Document Links
Add web and mailtolinks with the linkattribute of the textelement.
Once rendered asa PDF, clicking onthe link opens thedefault browser oremail client.
A Guide to Deck Page 10
![Page 64: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/64.jpg)
BOS
SFO
Virgin America 351Gate B388:35am
On Time
![Page 65: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/65.jpg)
JFK
IND
US Airways 1207Gate C31C5:35pm
Delayed
![Page 66: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/66.jpg)
Closing Price, 2015-01-13
AAPL
AMZN
FB
GOOG
MSFT
110.22
294.74
76.45
496.18
46.35
+0.97 (0.89%)
+3.33 (1.14%)
-0.27 (0.35%)
+3.63 (0.74%)
-0.24 (0.53%)
![Page 67: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/67.jpg)
Tree and Sky Rocks
Two Columns
One
Two
Three
Four
Five
Six
Seven
Eight
![Page 68: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/68.jpg)
go
build
clean
env
fix
fmt
generate
get
install
list
run
test
tool
version
vet
compile packages and dependencies
remove object files
print Go environment information
run go tool fix on packages
run gofmt on package sources
generate Go files by processing source
download and install packages and dependencies
compile and install packages and dependencies
list packages
compile and run Go program
test packages
run specified go tool
print Go version
run go tool vet on packages
![Page 69: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/69.jpg)
This is not a index card
![Page 70: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/70.jpg)
Can't buy me love Bliss
Misery We have each other
BetterWorse
Rich
Poor
![Page 71: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/71.jpg)
A few months ago, I had a look at the brainchildof a few serious heavyweights workingat Google. Their project, the Go programminglanguage, is a static typed, c lookalike,semicolon-less, self formatting, packagemanaged, object oriented, easily parallelizable,cluster fuck of genius with an unique classinheritance system. It doesn't have one.
![Page 72: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/72.jpg)
The Go Programming Language
Andrew Mackenzie-Ross, OBJECTIVE-C LESSONS FROM GO
is a static typed,
c lookalike,
semicolon-less,
self formatting,
package managed,
object oriented,
easily parallelizable,
cluster fuck of genius
with an unique class inheritance system.
![Page 73: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/73.jpg)
The Go Programming Language
Andrew Mackenzie-Ross, OBJECTIVE-C LESSONS FROM GO
is a static typed,
c lookalike,
semicolon-less,
self formatting,
package managed,
object oriented,
easily parallelizable,
cluster fuck of genius
with an unique class inheritance system.
![Page 74: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/74.jpg)
The Go Programming Language
is a static typed, c lookalike, semicolon-less, self formatting,package managed, object oriented, easily parallelizable,cluster fuck of genius with an unique class inheritance system
It doesn't have one.
Andrew Mackenzie-Ross, OBJECTIVE-C LESSONS FROM GO
![Page 75: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/75.jpg)
So, the next time you'reabout to make a subclass,think hard and ask yourself
what would Go do
Andrew Mackenzie-Ross
![Page 76: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/76.jpg)
Python and Ruby programmers come toGo because they don't have to surrendermuch expressiveness, but gain performanceand get to play with concurrency.
Less is exponentially moreRob Pike
![Page 77: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/77.jpg)
You must not blame me if I do talk to the clouds.
![Page 78: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/78.jpg)
FOR, LO,the winter is past,
the rain is over and gone;The flowers appear on the earth;
the time for the singing of birds is come, and the voice of the turtle is heard in our land.
Song of Solomon 2:11-12
![Page 79: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/79.jpg)
Dieter Rams
Good Design
is innovative
makes a product useful
is aesthetic
makes a product understandable
is unobtrusive
is honest
is long-lasting
is thorough down to the last detail
is environmentally-friendly
is as little design as possible
![Page 80: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/80.jpg)
You’ve got to start with thecustomer experience and workback toward the technology,not the other way around.
Steve Jobs
![Page 81: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/81.jpg)
giftGo Image Filtering Toolkit
![Page 82: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/82.jpg)
gift -contrast 80 -blur 4 rocks.jpg > abstract.jpg-blur=0: blur value
-brightness=-200: brightness value (-100, 100)
-contrast=-200: contrast value (-100, 100)
-crop="": crop x1,y1,x2,y2
-edge=false: edge
-emboss=false: emboss
-fliph=false: flip horizontal
-flipv=false: flip vertical
-gamma=0: gamma value
-gray=false: grayscale
-hue=-200: hue value (-180, 180)
-invert=false: invert
-max=0: local maximum (kernel size)
-mean=0: local mean filter (kernel size)
-median=0: local median filter (kernel size)
-min=0: local minimum (kernel size)
-resize="": resize w,h
-rotate=0: rotate specified degrees counter-clockwise
-saturation=-200: saturation value (-100, 500)
-sepia=-1: sepia percentage (0-100)
-sigmoid="": sigmoid contrast (midpoint,factor)
-transpose=false: flip horizontally and rotate 90° counter-clockwise
-transverse=false: flips vertically and rotate 90° counter-clockwise
-unsharp="": unsharp mask (sigma,amount,threshold)
![Page 83: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/83.jpg)
Picasso Turing
![Page 84: The Other Side of Go: Programming Pictures](https://reader034.vdocuments.us/reader034/viewer/2022051316/55cf8e05550346703b8db970/html5/thumbnails/84.jpg)
Thank you
github.com/ajstarks
@ajstarks
flickr.com/photos/ajstarks
speakerdeck.com/ajstarks
mindchunk.blogspot.com