Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
The Pragmatic Glitch (#rubykaigi 2013 LT)
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Shimpei Makimoto
May 31, 2013
Design
3.4k
4
Share
The Pragmatic Glitch (#rubykaigi 2013 LT)
one of lightning talks in RubyKaigi 2013
31st May, 2013
Shimpei Makimoto
May 31, 2013
More Decks by Shimpei Makimoto
See All by Shimpei Makimoto
How to Work with Legacy Ruby on Rails Applications in Treasure Data
makimoto
1
1.5k
JPEG を壊す話 / About JPEG corruption
makimoto
0
350
Training for New Graduates in Cookpad (Shitei Todan 2015)
makimoto
0
6.2k
How to read code
makimoto
0
1.6k
Glitch, OSS activities, and so on (Oedo RubyKaigi 04 #oedo04)
makimoto
5
1.4k
The Pragmatic Animated GIF in Ruby (a RubyConf 2013 lightning talk)
makimoto
0
570
グリッチについて話をします。 #wedding_s
makimoto
3
580
chiyahoya.me
makimoto
0
350
Recipes of Recipe Search
makimoto
5
1.5k
Other Decks in Design
See All in Design
decksh object reference
ajstarks
2
1.6k
見栄えと使いやすさの先にある 特別感 をデザインする / Designing a Sense of Specialness Beyond Aesthetics and Usability
bitkey
PRO
0
290
ClaudeCodeでマーケターの課題を解決する
kenichiota0711
11
13k
研修担当者が一番伸びた 熊本市役所✕AI『泥臭いAI研修』のワークショップ設計について
garyuten
2
340
チームをデザイン対象にする / Design for your team
kaminashi
1
1.1k
AIネイティブスタートアップにおけるプロダクト開発の新常識 / Product Development Tips in AI-Native Startups
saka2jp
2
1.2k
kintone Style Book
kintone
6
13k
富山デザイン勉強会_デザイントレンド2026.pdf
keita_yoshikawa
3
160
Ralph Penel Portfolio
ralphpenel
0
380
AI時代に求められるUXデザインのアプローチ
xtone
0
2.3k
Spacemarket Brand Guide
spacemarket
2
440
Franks Myth
gfht1
2
460
Featured
See All Featured
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9k
The Mindset for Success: Future Career Progression
greggifford
PRO
0
300
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
9.9k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
300
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
140
Build your cross-platform service in a week with App Engine
jlugia
234
18k
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
0
200
Mind Mapping
helmedeiros
PRO
1
140
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
livdayseo
0
96
A Modern Web Designer's Workflow
chriscoyier
698
190k
The Language of Interfaces
destraynor
162
26k
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
91
Transcript
The Pragmatic Glitch Shimpei Makimoto https://github.com/makimoto https://twitter.com/makimoto one of lightning
talks in RubyKaigi 2013 | 31st May, 2013 Έͳ͞Μ͜Μʹͪɻ 5IF1SBHNBUJD(MJUDIͱ͍͏Λ͠·͢ɻ
ӳޠͰൃද͢ΔͷͰຊޠͷࣈນΛ͍Ε·ͨ͠ɻ I talk it in (poor) English, so I added
Japanese subs.
self ·ͣࣗݾհ͔Βɻ
Shimpei Makimoto / ຊ৻ฏ https://{github,twitter}.com/makimoto photo by mirakui ຊ৻ฏͱ͍͍·͢ɻ 5XJUUFS(JU)VCͰ!NBLJNPUPͱ͍͏ΞΧϯτ໊Ͱ͢ɻ
We’re hiring http://info.cookpad.com/jobs http://info.cookpad.com/en ΫοΫύου͔Βདྷ·ͨ͠ɻ ͨͩ͠ɺ͜ͷൃදࢲͷޏ༻ओͱؔ͋Γ·ͤΜɻ
Glitch ͦΕͰάϦονͷͰ͢ɻ άϦονͱԿͰ͠ΐ͏͔ʁ
me ͜ΕࢲͰ͢ɻ
me me (in glitch) ͜ΕࢲͰ͢ɻͨͩ͠άϦον͍ͯ͠·͢ɻ
It’s Glitch ͜Ε͕άϦονͰ͢ɻ͓Θ͔ΓͰ͢Ͷʁ
How? Ͳ͏ͬͯ͜ΕΛ࣮ݱ͍ͯ͠ΔͷͰ͠ΐ͏ʁͱͯ؆୯Ͱ͢ɻ
sed ‘s/a/b/g’ original.jpg > glitch.jpg ͜Ε͚ͩͰ͢ɻTFEΛͬͯจࣈBΛจࣈCʹஔ͖͍͑ͯ·͢ɻ
sed(1) glitch ͜ΕΛҰൠʹTFEάϦονͱ͍͍·͢ɻ
Ruby 3VCZΛͬͯͳ͍ʁͦ͏Ͱ͢ͶɻͰ3VCZΛͬͯΈ·͢ɻ
ruby as better sed ·ͣΑΓྑ͍TFEͱͯ͠SVCZΛ͍·͢ɻ
ruby -e 'print ARGF.read.force_encoding("ascii-8bit").gsub("a", "b")' original.jpg > glitch.jpg ͍͍ͩͨ͜ΜͳϫϯϥΠφʔͰઌ΄Ͳͷͷͱಉ͜͡ͱ͕࣮ݱͰ͖·͢ɻ
ruby --external-encoding=ascii-8bit -e 'print ARGF.read.gsub("a", "b")' original.jpg > glitch.jpg ͪΖΜ͓ΈͰ͜Μͳײ͡ʹ͍͍ͯ͠Ͱ͢ɻ
me me (in glitch) ͍ͣΕʹ͠ΖάϦονͨ͠ը૾͕࡞͞Ε·͢ɻ
data = ARGF.read.force_encoding('ascii-8bit') 36.times do |from| from = from.to_s(36) 36.times
do |to| to = to.to_s(36) open("#{from}_#{to}.jpg", 'wb').write(data.gsub(from, to)) end end ͍ͬͺ͍ը૾͕΄͚͠Ε͜ΜͳίʔυΛॻ͍͍͍ͯͰ͢ɻ
͜Μͳײ͡Ͱը૾͕େྔʹ࡞͞Ε·͢ɻ
៉ྷͰ͢Ͷɻ
Glitch in web applications ͯ͞ɺ͔͜͜Βগ͠Ԡ༻دΓͷΛ͠·͢ɻ ΣϒΞϓϦέʔγϣϯΛྫʹ͠·͠ΐ͏ɻ
Rubyistokei ͓ͦΒ͘Έͳ͞Μ3VCZJTUPLFJΛ͝ଘͩͱࢥ͍·͢ɻ
͜ΕͰ͢ɻ
I apologize before a demo ͋Β͔͡Ί֤ؔҐʹँΓ·͢ɻ
Let’s break Rubyistokei ͦΕͰ3VCZJTUPLFJΛյ͠·͠ΐ͏ɻ
Glitch Rubyistokei 3VCZJTUPLFJ͔ΒϑΥʔΫͤ͞ɺ (MJUDI3VCZJTUPLFJΛ࡞Γ·ͨ͠ɻ ແஅͰ
http://glitch-rubyistokei.herokuapp.com
إ͕ݟ͑ͨ΄͏͕ྑ͍ͱࢥͬͨͷͰɺ ͜Μͳײ͡Ͱ͚ͩյ͢ͱ͍͏͜ͱΛͯ͠Έ·ͨ͠ɻ
How? ͜Ε͕ͲͷΑ͏ʹ࣮ݱ͞Ε͍ͯΔ͔ɺ ιʔείʔυΛݟͯΒ͏ͷ͕ૣ͍Ͱ͢ɻ
3VCZJTUPLFJ4JOBUSBΞϓϦέʔγϣϯͰ͢ɻ ը૾Λյ͢ϝιουΛՃͯͦ͠ΕΛද͍ࣔͤͯ͞·͢ɻ
get '/glitch' do data = open(params[:url]).read data_a = data[0 ..
data.size / 2] data_b = data[data.size / 2 .. -1] content_type :jpeg data_a + data_b.force_encoding('ascii-8bit').gsub('a', 'b') end ͬ͟ͱݟͯΒͬͨΒΘ͔ΔΜͰ͕͢ɺ؆୯ͳϩδοΫͰ͢ɻ
get '/glitch' do data = open(params[:url]).read data_a = data[0 ..
data.size / 2] data_b = data[data.size / 2 .. -1] content_type :jpeg data_a + data_b.force_encoding('ascii-8bit').gsub('a', 'b') end ը૾ϑΝΠϧΛಡΈࠐΜͰɺͭͷϒϩοΫʹΘ͚·͢ɻ
get '/glitch' do data = open(params[:url]).read data_a = data[0 ..
data.size / 2] data_b = data[data.size / 2 .. -1] content_type :jpeg data_a + data_b.force_encoding('ascii-8bit').gsub('a', 'b') end ࠷ॳͷϒϩοΫͦͷ··ʹɺ࣍ͷϒϩοΫͰHTVC͠·ͯग़ྗ͠·͢ɻ
ͦΕʹΑͬͯ͜ͷΑ͏ʹ͚ͩյΕͨը૾͕ੜͰ͖·͢ɻ
https://github.com/makimoto/rubyistokei/tree/glitch ͜ͷϒϥϯν͜ͷ63-Ͱެ։͞Ε͍ͯ·͢ɻ
def show respond_to do |format| format.html do # snip end
format.glitch do data = open(IMAGES_PATH.join(params[:id])) data = data.force_encoding('ascii-8bit').gsub('a', 'b') send_data data, type: 'image/jpeg', disposition: 'inline' end end end ͪͳΈʹ3BJMTͰಉ༷ͷॲཧΛߦ͓͏ͱͨ͠Β͜Μͳײ͡ʹͳΓ·͢ɻ protip: Case in Rails
Wrapping up ·ͱΊ·͢ɻ
Glitch is quick and easy Glitch is useful for web
applications (JPEG is good) ͱ͍͏͜ͱͰɺάϦονૉૣ͘Ͱ͖ͯ؆୯Ͱ͢ɻ ΣϒΞϓϦέʔγϣϯͱͷੑߴ͍Ͱ͢ɻͥͻࢼ͍ͯͩ͘͠͞ɻ You can try it!!1;
The Pragmatic Glitch one of lightning talks in RubyKaigi 2013
| 31st May, 2013 Shimpei Makimoto https://github.com/makimoto https://twitter.com/makimoto