🖼 !?!!
Visual Programming Languages vs. Ruby
EMILY
NAKASHIMA
@eanakashima
BY DAY, ENG
MANAGER @
HONEYCOMB.IO
By night, design & viz nerd!
!= EXPERT
VISUAL PROGRAMMING
LANGUAGES!
(VPLS)
SCRATCH
via MIT Media Lab
- Amanda Wilson, David C. Moffat, 

https://www.researchgate.net/figure/Screenshot-of-a-classic-Hello-World-program-in-Scratch_fig1_266490101
- mberry, wikipedia

https://en.wikipedia.org/wiki/Scratch_(programming_language)#/media/File:Scratch_Hello_World.png
- max johnson

https://blog.penjee.com/scratch-2-0-in-4-easy-steps-animated-gif
- @paulsinnett

http://ludumdare.com/compo/2013/04/29/creating-a-physics-system-in-sratch
event handler "
variable "
loop with condition "
“This type of support is highly useful but,
computationally speaking, trivial compared to the
challenges ahead attempting to support users to
produce meaningful programs. The most daunting
challenge will be to support pragmatics, that is the
study of what code means in particular situation.
- Alexander Repenning

https://sgd.cs.colorado.edu/wiki/images/2/21/20YearsofBlockProgramingLessonsLearned_published.pdf
WHAT ARE THE HARD PARTS?
➤ Conditionals are hard to read
➤ Abstraction is hard & might require
inventing new visual grammar
➤ Code reuse is hard
➤ Hard to diff & merge
➤ Resource-intensive
➤ Type checking may be hard to visualize
➤ Doesn’t fit on-screen well
➤ Code comments are hard
➤ Your face can only absorb so many shapes
WHAT ABOUT RUBY?
What does its design optimize for?
SYNTAX!
Simple & easy to learn
# Ruby’s syntax is relatively forgiving & easy to learn:
Kernel.puts("potato")
Kernel.puts('potato')
Kernel.puts('potato',)
Kernel .puts('potato')
Kernel.puts 'potato'
puts 'potato'
Visual programming for IoT

From top left: Modkit, FlowHub, Node-RED
# Chef uses a ruby DSL
%w(public logs).each do |dir|
directory "#{node.app.web_dir}/#{dir}" do
owner node.user.name
mode "0755"
recursive true
end
end
CLASSES & OBJECTS
Ruby wants to make it *so* easy to make Classes & Objects
class Booplesnoot
def hop
puts "hoppity hop 🐰"
end
end
Booplesnoot.new.hop # prints hoppity hop 🐰
CLASSES & OBJECTS (SKETCHPAD – 1963)
CODE REUSE
Composition, inheritance, methods, and more
module mobility
def hop
puts "hoppity hop 🐻 | 🐰"
end
end
class DangerFloof
include mobility
end
class Booplesnoot
include mobility
end
CODE REUSE (CHIMERA)
Chimera
SO WHAT’S HARD IN RUBY?
???
SHOW STATE
What state is buried inside my app?
PYGMALION (1975)
SHOW THE WHOLE
How do the pieces of a program fit together?
SHOW THE WHOLE (FUSION 9)
Fusion 9
SHOW THE WHOLE (CUBE – 1995)
SO WHAT?
What can we learn from VPLs?
THANK YOU!
twitter.com/eanakashima for more hot takes ☄
https://bit.ly/2KVWfeA for references 📜

Visual Programming Languages vs. Ruby