SlideShare una empresa de Scribd logo
1 de 12
Descargar para leer sin conexión
CSS1行で変わる世界
自己紹介
本名:佐村木 友紀 活動名:Level Drain
奈良先端科学技術大学院大学 バイオサイエンス修了 →
アダルト系ソシャゲ運営 → 京都コンピュータ学院 →
株式会社フォーゼム(今年から、おそらくはアシスタントとして)
ゲームディレクター / フロントエンドエンジニア
として UX / UI に触れている世界の人
登壇の目的
 最近、作った成果物と発見を誰かに見て欲しい
 フロントエンドまたはアーティスト界隈の仲間が欲しい
 ぼっち寂しい
 ぼっち寂しい
 ぼっち寂しい
 ぼっち心細い……
 エンジニア充しにきました!!
ポートフォリオ制作時
Vue.jsという最近流行りのフレームワークで遊んでいました。
WebGL系ライブラリでアニメーションをふんだんに使ったら、
あー『処理負荷』のこと考えないとイカンなと思い始めました
必要のないアニメーションを止める
どちらが文字に集中できたでしょうか?
記事に集中してほしいとき、
わざわざ処理負荷がかかる背景アニメーションは必要なのか?
と考えたわけです。
磯野家の闇磯野家の闇
というわけで止めてみました
お楽しみ「動くもの」タイムに参ります
 LT用デモサイト
 https://zen-blackwell-d45ec7.netlify.app/
止めたらバグっぽい
一瞬、アニメーションが止まる不具合に見えたので
はないでしょうか。
「仕様です」と言わずに、
直感で仕様を伝えるには?
コイツ1行で対応だ!!
ぼかしだけで印象が変わります
ぼかしよ…… 大儀である!
動きを比べてみましょう
お楽しみ「動くもの」タイムに参ります
 本家ポートフォリオ
 https://pf-ueshimalab.netlify.app/
 LT用デモサイト
 https://zen-blackwell-d45ec7.netlify.app/
お伝えしたいこと
 体験や体感は、些細なことで大きく変わります
 萌えキャラと普通の子に「好きです!!」と言われたようにシンプルです
 大掛かりな実装も、難しい技術も必要ありません。
 使って「気持ちいいか」にも気を配ってみてはいかがでしょうか?
ご清聴ありがとうございました
私の詳細はこちらに置いておきます

Más contenido relacionado

La actualidad más candente

【Unite Tokyo 2019】学生向けUnity教育の導入事例
【Unite Tokyo 2019】学生向けUnity教育の導入事例【Unite Tokyo 2019】学生向けUnity教育の導入事例
【Unite Tokyo 2019】学生向けUnity教育の導入事例UnityTechnologiesJapan002
 
ゲーム開発で使えるかもしれないレイアウトデザイン
ゲーム開発で使えるかもしれないレイアウトデザインゲーム開発で使えるかもしれないレイアウトデザイン
ゲーム開発で使えるかもしれないレイアウトデザインKodai Yano
 
cocos2d-xを勉強し始めるまで
cocos2d-xを勉強し始めるまでcocos2d-xを勉強し始めるまで
cocos2d-xを勉強し始めるまでYosuke Fujii
 
わたしのVisual studio環境
わたしのVisual studio環境わたしのVisual studio環境
わたしのVisual studio環境Keigo Ando
 
「UI/UXデザインでサイトを改善しよう」EC-CUBE勉強会 vol.16
「UI/UXデザインでサイトを改善しよう」EC-CUBE勉強会 vol.16「UI/UXデザインでサイトを改善しよう」EC-CUBE勉強会 vol.16
「UI/UXデザインでサイトを改善しよう」EC-CUBE勉強会 vol.16Kentaro Ohkouchi
 
Sketch速習会@Wantedly
Sketch速習会@WantedlySketch速習会@Wantedly
Sketch速習会@Wantedly龍 宇佐美
 
Railsしかやってなかった人が10時間で Swift iOSゲームをつくったら
Railsしかやってなかった人が10時間で Swift iOSゲームをつくったらRailsしかやってなかった人が10時間で Swift iOSゲームをつくったら
Railsしかやってなかった人が10時間で Swift iOSゲームをつくったらYuta Okazaki
 
ゲームAIの基礎と事例
ゲームAIの基礎と事例ゲームAIの基礎と事例
ゲームAIの基礎と事例Tomoaki TSUCHIE
 
20140314 Unity勉強会 PostProcessBuild のおはなし
20140314 Unity勉強会 PostProcessBuild のおはなし20140314 Unity勉強会 PostProcessBuild のおはなし
20140314 Unity勉強会 PostProcessBuild のおはなしMori Tetsuya
 
うだたんの話 ~ VR アバターで自撮りする話
うだたんの話 ~ VR アバターで自撮りする話うだたんの話 ~ VR アバターで自撮りする話
うだたんの話 ~ VR アバターで自撮りする話Udasan
 
おもわずハマるゲームのUI&UX
おもわずハマるゲームのUI&UXおもわずハマるゲームのUI&UX
おもわずハマるゲームのUI&UXUX MILK
 
UX actually is all around us. - UXを感じよう -
UX actually is all around us. - UXを感じよう -UX actually is all around us. - UXを感じよう -
UX actually is all around us. - UXを感じよう -Akihiro Mukai
 
Cocoa勉強会20140621 macとiosで共通のコード
Cocoa勉強会20140621 macとiosで共通のコードCocoa勉強会20140621 macとiosで共通のコード
Cocoa勉強会20140621 macとiosで共通のコードSatoshi Oomori
 
もちょブログ解析入門
もちょブログ解析入門もちょブログ解析入門
もちょブログ解析入門sudosan
 
Scala、play初心者が触った感想 share用
Scala、play初心者が触った感想 share用Scala、play初心者が触った感想 share用
Scala、play初心者が触った感想 share用amkt922
 
2017冬の開発合宿vrオンラインゲーム
2017冬の開発合宿vrオンラインゲーム2017冬の開発合宿vrオンラインゲーム
2017冬の開発合宿vrオンラインゲームSyo Igarashi
 
20150123 第28回 Unity 勉強会「Unity に於けるビルド自動化のおはなし & 設定管理とリソース管理のおはなし」
20150123 第28回 Unity 勉強会「Unity に於けるビルド自動化のおはなし & 設定管理とリソース管理のおはなし」20150123 第28回 Unity 勉強会「Unity に於けるビルド自動化のおはなし & 設定管理とリソース管理のおはなし」
20150123 第28回 Unity 勉強会「Unity に於けるビルド自動化のおはなし & 設定管理とリソース管理のおはなし」Mori Tetsuya
 

La actualidad más candente (20)

【Unite Tokyo 2019】学生向けUnity教育の導入事例
【Unite Tokyo 2019】学生向けUnity教育の導入事例【Unite Tokyo 2019】学生向けUnity教育の導入事例
【Unite Tokyo 2019】学生向けUnity教育の導入事例
 
ゲーム開発で使えるかもしれないレイアウトデザイン
ゲーム開発で使えるかもしれないレイアウトデザインゲーム開発で使えるかもしれないレイアウトデザイン
ゲーム開発で使えるかもしれないレイアウトデザイン
 
cocos2d-xを勉強し始めるまで
cocos2d-xを勉強し始めるまでcocos2d-xを勉強し始めるまで
cocos2d-xを勉強し始めるまで
 
わたしのVisual studio環境
わたしのVisual studio環境わたしのVisual studio環境
わたしのVisual studio環境
 
Hack U TokyoTech 2016
Hack U TokyoTech 2016Hack U TokyoTech 2016
Hack U TokyoTech 2016
 
「UI/UXデザインでサイトを改善しよう」EC-CUBE勉強会 vol.16
「UI/UXデザインでサイトを改善しよう」EC-CUBE勉強会 vol.16「UI/UXデザインでサイトを改善しよう」EC-CUBE勉強会 vol.16
「UI/UXデザインでサイトを改善しよう」EC-CUBE勉強会 vol.16
 
Sketch速習会@Wantedly
Sketch速習会@WantedlySketch速習会@Wantedly
Sketch速習会@Wantedly
 
Railsしかやってなかった人が10時間で Swift iOSゲームをつくったら
Railsしかやってなかった人が10時間で Swift iOSゲームをつくったらRailsしかやってなかった人が10時間で Swift iOSゲームをつくったら
Railsしかやってなかった人が10時間で Swift iOSゲームをつくったら
 
ゲームAIの基礎と事例
ゲームAIの基礎と事例ゲームAIの基礎と事例
ゲームAIの基礎と事例
 
20140314 Unity勉強会 PostProcessBuild のおはなし
20140314 Unity勉強会 PostProcessBuild のおはなし20140314 Unity勉強会 PostProcessBuild のおはなし
20140314 Unity勉強会 PostProcessBuild のおはなし
 
Narrative
NarrativeNarrative
Narrative
 
うだたんの話 ~ VR アバターで自撮りする話
うだたんの話 ~ VR アバターで自撮りする話うだたんの話 ~ VR アバターで自撮りする話
うだたんの話 ~ VR アバターで自撮りする話
 
Bloodstainedで世界のバッカーの期待に応えたUE4事例紹介
Bloodstainedで世界のバッカーの期待に応えたUE4事例紹介Bloodstainedで世界のバッカーの期待に応えたUE4事例紹介
Bloodstainedで世界のバッカーの期待に応えたUE4事例紹介
 
おもわずハマるゲームのUI&UX
おもわずハマるゲームのUI&UXおもわずハマるゲームのUI&UX
おもわずハマるゲームのUI&UX
 
UX actually is all around us. - UXを感じよう -
UX actually is all around us. - UXを感じよう -UX actually is all around us. - UXを感じよう -
UX actually is all around us. - UXを感じよう -
 
Cocoa勉強会20140621 macとiosで共通のコード
Cocoa勉強会20140621 macとiosで共通のコードCocoa勉強会20140621 macとiosで共通のコード
Cocoa勉強会20140621 macとiosで共通のコード
 
もちょブログ解析入門
もちょブログ解析入門もちょブログ解析入門
もちょブログ解析入門
 
Scala、play初心者が触った感想 share用
Scala、play初心者が触った感想 share用Scala、play初心者が触った感想 share用
Scala、play初心者が触った感想 share用
 
2017冬の開発合宿vrオンラインゲーム
2017冬の開発合宿vrオンラインゲーム2017冬の開発合宿vrオンラインゲーム
2017冬の開発合宿vrオンラインゲーム
 
20150123 第28回 Unity 勉強会「Unity に於けるビルド自動化のおはなし & 設定管理とリソース管理のおはなし」
20150123 第28回 Unity 勉強会「Unity に於けるビルド自動化のおはなし & 設定管理とリソース管理のおはなし」20150123 第28回 Unity 勉強会「Unity に於けるビルド自動化のおはなし & 設定管理とリソース管理のおはなし」
20150123 第28回 Unity 勉強会「Unity に於けるビルド自動化のおはなし & 設定管理とリソース管理のおはなし」
 

Similar a CSS1行で変わる世界

年越しVue.jsをした話
年越しVue.jsをした話年越しVue.jsをした話
年越しVue.jsをした話YukiSamuraki
 
ゲームに学ぶUXデザイン
ゲームに学ぶUXデザインゲームに学ぶUXデザイン
ゲームに学ぶUXデザインAkihiro Moriyama
 
おれ、ちょうじん
おれ、ちょうじんおれ、ちょうじん
おれ、ちょうじんatmarkit
 
【DevLOVE甲子園2014】デザイナーも、 アジャイル開発に 挑みたい!(希望)
【DevLOVE甲子園2014】デザイナーも、  アジャイル開発に  挑みたい!(希望)【DevLOVE甲子園2014】デザイナーも、  アジャイル開発に  挑みたい!(希望)
【DevLOVE甲子園2014】デザイナーも、 アジャイル開発に 挑みたい!(希望)Chihiro Tomita
 
フロントエンドというカオスな世界について
フロントエンドというカオスな世界についてフロントエンドというカオスな世界について
フロントエンドというカオスな世界についてmikakane
 
フレデリカが可愛いという話とARの話
フレデリカが可愛いという話とARの話フレデリカが可愛いという話とARの話
フレデリカが可愛いという話とARの話SaruKabuto
 
Smartphone ui:ux」 de na creative seminar vol.1 レポート
Smartphone ui:ux」 de na creative seminar vol.1 レポートSmartphone ui:ux」 de na creative seminar vol.1 レポート
Smartphone ui:ux」 de na creative seminar vol.1 レポートMasaru Kimura
 
「XD、受託案件で使ってみた」Adobe XD ユーザーフェス (名古屋)
「XD、受託案件で使ってみた」Adobe XD ユーザーフェス (名古屋)「XD、受託案件で使ってみた」Adobe XD ユーザーフェス (名古屋)
「XD、受託案件で使ってみた」Adobe XD ユーザーフェス (名古屋)Sakura Asano
 
アーティストだけでぷちコン! -「Veloce」製作事例-
アーティストだけでぷちコン! -「Veloce」製作事例-アーティストだけでぷちコン! -「Veloce」製作事例-
アーティストだけでぷちコン! -「Veloce」製作事例-genichiro masaki
 
Html5+javascriptでゲーム開発
Html5+javascriptでゲーム開発Html5+javascriptでゲーム開発
Html5+javascriptでゲーム開発Tatsuya Fukuda
 
20161125 尾崎 bootstrap
20161125 尾崎 bootstrap20161125 尾崎 bootstrap
20161125 尾崎 bootstrapTsuyoshi Saito
 
2019/12/06 社内勉強会「ついやってしまう」体験のつくりかた
2019/12/06 社内勉強会「ついやってしまう」体験のつくりかた2019/12/06 社内勉強会「ついやってしまう」体験のつくりかた
2019/12/06 社内勉強会「ついやってしまう」体験のつくりかたbeychan
 
2016 0422 io tlt勉強会
2016 0422 io tlt勉強会2016 0422 io tlt勉強会
2016 0422 io tlt勉強会yasuyuki_suzuki
 
ハリウッド流映画脚本講座・特別編 「ゲーム」は「キャラクター」がドライブする 〜ヒットする、原作付きキャラクターゲームシナリオの作り方〜
ハリウッド流映画脚本講座・特別編「ゲーム」は「キャラクター」がドライブする〜ヒットする、原作付きキャラクターゲームシナリオの作り方〜ハリウッド流映画脚本講座・特別編「ゲーム」は「キャラクター」がドライブする〜ヒットする、原作付きキャラクターゲームシナリオの作り方〜
ハリウッド流映画脚本講座・特別編 「ゲーム」は「キャラクター」がドライブする 〜ヒットする、原作付きキャラクターゲームシナリオの作り方〜小林 信行
 
波に乗ってUnity3Dを使ってみているんだが (Ameba x Pixiv 合同勉強会LT)
波に乗ってUnity3Dを使ってみているんだが (Ameba x Pixiv 合同勉強会LT)波に乗ってUnity3Dを使ってみているんだが (Ameba x Pixiv 合同勉強会LT)
波に乗ってUnity3Dを使ってみているんだが (Ameba x Pixiv 合同勉強会LT)maginemu Mishimagi
 
機能はちゃんと試してからリリースしようねという話
機能はちゃんと試してからリリースしようねという話機能はちゃんと試してからリリースしようねという話
機能はちゃんと試してからリリースしようねという話Yu Morita
 
Splatoonでux白書の4段階の話をする
Splatoonでux白書の4段階の話をするSplatoonでux白書の4段階の話をする
Splatoonでux白書の4段階の話をするKenshiro Mitsutani
 

Similar a CSS1行で変わる世界 (20)

年越しVue.jsをした話
年越しVue.jsをした話年越しVue.jsをした話
年越しVue.jsをした話
 
ゲームに学ぶUXデザイン
ゲームに学ぶUXデザインゲームに学ぶUXデザイン
ゲームに学ぶUXデザイン
 
おれ、ちょうじん
おれ、ちょうじんおれ、ちょうじん
おれ、ちょうじん
 
【DevLOVE甲子園2014】デザイナーも、 アジャイル開発に 挑みたい!(希望)
【DevLOVE甲子園2014】デザイナーも、  アジャイル開発に  挑みたい!(希望)【DevLOVE甲子園2014】デザイナーも、  アジャイル開発に  挑みたい!(希望)
【DevLOVE甲子園2014】デザイナーも、 アジャイル開発に 挑みたい!(希望)
 
フロントエンドというカオスな世界について
フロントエンドというカオスな世界についてフロントエンドというカオスな世界について
フロントエンドというカオスな世界について
 
フレデリカが可愛いという話とARの話
フレデリカが可愛いという話とARの話フレデリカが可愛いという話とARの話
フレデリカが可愛いという話とARの話
 
Smartphone ui:ux」 de na creative seminar vol.1 レポート
Smartphone ui:ux」 de na creative seminar vol.1 レポートSmartphone ui:ux」 de na creative seminar vol.1 レポート
Smartphone ui:ux」 de na creative seminar vol.1 レポート
 
Xrのuxの話
Xrのuxの話Xrのuxの話
Xrのuxの話
 
「XD、受託案件で使ってみた」Adobe XD ユーザーフェス (名古屋)
「XD、受託案件で使ってみた」Adobe XD ユーザーフェス (名古屋)「XD、受託案件で使ってみた」Adobe XD ユーザーフェス (名古屋)
「XD、受託案件で使ってみた」Adobe XD ユーザーフェス (名古屋)
 
Dev lovex day1_4a
Dev lovex day1_4aDev lovex day1_4a
Dev lovex day1_4a
 
アーティストだけでぷちコン! -「Veloce」製作事例-
アーティストだけでぷちコン! -「Veloce」製作事例-アーティストだけでぷちコン! -「Veloce」製作事例-
アーティストだけでぷちコン! -「Veloce」製作事例-
 
Html5+javascriptでゲーム開発
Html5+javascriptでゲーム開発Html5+javascriptでゲーム開発
Html5+javascriptでゲーム開発
 
20161125 尾崎 bootstrap
20161125 尾崎 bootstrap20161125 尾崎 bootstrap
20161125 尾崎 bootstrap
 
2019/12/06 社内勉強会「ついやってしまう」体験のつくりかた
2019/12/06 社内勉強会「ついやってしまう」体験のつくりかた2019/12/06 社内勉強会「ついやってしまう」体験のつくりかた
2019/12/06 社内勉強会「ついやってしまう」体験のつくりかた
 
2016 0422 io tlt勉強会
2016 0422 io tlt勉強会2016 0422 io tlt勉強会
2016 0422 io tlt勉強会
 
ハリウッド流映画脚本講座・特別編 「ゲーム」は「キャラクター」がドライブする 〜ヒットする、原作付きキャラクターゲームシナリオの作り方〜
ハリウッド流映画脚本講座・特別編「ゲーム」は「キャラクター」がドライブする〜ヒットする、原作付きキャラクターゲームシナリオの作り方〜ハリウッド流映画脚本講座・特別編「ゲーム」は「キャラクター」がドライブする〜ヒットする、原作付きキャラクターゲームシナリオの作り方〜
ハリウッド流映画脚本講座・特別編 「ゲーム」は「キャラクター」がドライブする 〜ヒットする、原作付きキャラクターゲームシナリオの作り方〜
 
Start Sketch.app
Start Sketch.appStart Sketch.app
Start Sketch.app
 
波に乗ってUnity3Dを使ってみているんだが (Ameba x Pixiv 合同勉強会LT)
波に乗ってUnity3Dを使ってみているんだが (Ameba x Pixiv 合同勉強会LT)波に乗ってUnity3Dを使ってみているんだが (Ameba x Pixiv 合同勉強会LT)
波に乗ってUnity3Dを使ってみているんだが (Ameba x Pixiv 合同勉強会LT)
 
機能はちゃんと試してからリリースしようねという話
機能はちゃんと試してからリリースしようねという話機能はちゃんと試してからリリースしようねという話
機能はちゃんと試してからリリースしようねという話
 
Splatoonでux白書の4段階の話をする
Splatoonでux白書の4段階の話をするSplatoonでux白書の4段階の話をする
Splatoonでux白書の4段階の話をする
 

CSS1行で変わる世界