topic path

バナナはおやつに入りますか? HTMLはプログラミングにはいりますか??

関西フロントエンドUG 年忘れLT大会にいってきました。

2016/12/3(sat)ですがKFUGさんのLT大会、要はタダでピザ食べる会があったので行ってきました。

kfug.connpass.com

私の人生の中で、人前でピザたべr...ちがった人前でLTするという体験を初めてしたのが、去年のこの会です。事前に「コワくないですか?」を入念に確認してからの参加です。

結果、多分コワくない。しかも、なに喋ってもコワくない。というのを理解したので、前々から温めていたけどどこにも出しようがないネタを、満を持して持って行きました。

 

「パンくずナビ」の名称について語る。

speakerdeck.com

ココに載っていることしか喋っていませんが、気づいたこと+α。

イマドキのWeb屋さんたちって、意外と「ぱんくず」の由来しらない??

ちょっとびっくり。

「コレのこと、なんて呼んでます?」にはみなさん「ぱんくずー!」って元気に答えてくださったのですが、「パンくずの由来って知ってます?」に答えてくださったの、仲良くしてくださってるデザイナーさん1人の声しか返ってこなかったんです。

聞こえなかっただけで他にも答えてくださった方いはると思うのですが、「ぱんくず」との差があまりに大きくてとてもびっくりしました。

正解:「ヘンゼルとグレーテル

コレがないと先に進めないので...(苦笑)正直、焦りましたw

発表することの楽しさを、改めて知る。

DEMOは完全にオチです。

LTの最初に「何一つ役に立たない話します」「JSのテクニカルな話は一切しません」と宣言してましたが、DEMOまでにはそれを一旦忘れてもらえるような流れにしていました。真面目そうに見える話は全部オチで潰れますからねw

DEMO前までに「ふんふん。そうだよね。」って感じの反応をくださってた方が結構いはって、「そ...そうか。これも気づきなんだ...」ってこちらの方が改めて気づかされました。普段、自分が普通に思っていることっていうの、他の人には同じとは限りませんからね。

そしてDEMO。会場が一斉に「ふぁっ?!?!」て空気になるのがホント嬉しかった!!!

「へ?なにが起きた今?!」って表情が変わり、それが温かい笑いに変わっていくの、すごく幸せでした。

一方の私ですが、DEMO開始からあの子が来るまでの数秒間、技術解説をするフリしながらめっちゃビクビクしてました。DEMO動かなかったらどうしよう。スベったらどうしよう。すでにココまででネタをお察しの方いはるかも。...ドキドキドキドキ。

なので、緊張しすぎてほんの数名の表情しか見えてませんでした。なので、その数名の方の、スクリーンに食い入るような表情を見て、ものすごくホッとしたのです。

会場が温かい笑いに包まれるのを感じて、私は緊張をといたのでした。ほんとみなさまありがとうございました。

ちょっとだけ、技術解説。

DEMO中にちょっとだけお話ししましたが、正直緊張しすぎて支離滅裂でしたw まともに喋れてませんw

でも、見てくださった皆さんもDEMOに気を取られて聞いてなかったと思われるので許してください。

一応、DEMOはこちら。jQueryのpluginにしかけてる途中です。

https://matsudaemi.github.io/real-bread-crumb/demo/

データ保持の仕組み

データについては、「今開いているページ」のlocation.pathとtitle要素文字列(区切り文字の前まで)を、sessionStorageに保存します。

なので、このJSを読み込んでいるページ全てでこのデータを参照できます。

ちなみに、食べられちゃったぱんくずは、食べられちゃったままですw

飛んでくるあの子

あの子はspanひとつで作ってます。:beforeでくちばし、:afterではね。本体とはねは、border-radiusで葉っぱを作るような要領で、ほどほどに形を作っています。複雑な形はできないんですよね(苦笑)。

動きは@animation-frameで、はばたきともぞもぞ感を出しています。

飛んでくる場所は、window幅のどこかからランダムに。

ぱんくず、ひとつひとつ

1文字ずつ、spanで区切ってclass名つけてます。そのspanをランダムに狙い撃ちして飛んできます。食べられちゃったら、class削除してopacityを0に。要素を削除しないのは、文字詰めが入ると、無駄な動きが出てしまうから。このとき、sessionStorageからは食べられちゃったぱんくずは削除しておきます。

おわってから

懇親会のときに、改めて仕組みについて聞かれたりとか「コード見てみたんですけど」ってお話ししていただいたりとか、関心もっていただいたのが嬉しかったです。ていうか、あの短時間でgithubまでたどり着いてくださるとかほんとすごい。学生さんすごい。

もちろん、他のプレゼンもきいてきたよ

関西コワいっていう自己ブランディングのLTに関しては続きが気になりますw

さくらサーバさんの新卒さんのお話では、さくらサーバさんも色々やってるんだなー&IoT関連、やっぱ最近手出してるんだ。とか。

フロントからデザインに職種替えされたお話では「会話」と「対話」の違い。

流行りに振り回されてデザイン変えたりせずに、「自分へ」のお仕事をいただくお話とか。

スケートリンクに関わるデザインについての考察とか。

多様性についてのお話からムリクリwebにつなげる方とか。

女性の胃袋つかもうと思ったら3連皿買おうとか(ウチにはすでにある)。

ハードワークでもちゃんと栄養とろうねとか。

いろんな方のいろんな転職のお話とか。

ネットワークビジネスに気をつけろとか。

ほんと、みなさまいろんなネタ持ってはるなぁぁ...。とても面白かったです。

お料理、おいしかった!

隔週で料理屋さんやってるらしい参加者さんのご提供のお料理。生春巻きとかごまポテサラとかエビのリエットとか。

宅配のピザとか食べる気しなかったw

ワインも美味しいの持って来ていただいてて、気がついたらスペインのマラガのワインとかいただいちゃってました。けど、ちゃんとボトル見ずにいただいていたので、どれがマラガだったのかさっぱり☆

でも、どれも美味しかったです!

発表って、緊張するしめんどいけど、楽しい。

気軽に「やってみてー」とは言いづらいけど、これはこれで、機会があったらやってみるのはよいことだなぁと思いました。

練れば練るほど、自分に返ってくる気がします。去年はさらっとやっただけなのですが、それはそれでラクだったしほどほどに良かったけど、今年はDEMO作ってネタ仕込んで...ってちょっと頑張ってみたら、そっちの方が、自分にとってのやりがいだとか他の方の反応の嬉しさとか、そういうのが断然よかったなぁと思っています。

次も機会があったら...とか思いつつも、もう面白ネタないんだよなぁ...。残念。

またいつか、ネタできたら考えてみます。

ではでは。