HTMLが、HTML5になってから、ありそうでなかったツール。作りました。 HTML5 入れ子チートシート。 どういうツールか たとえば、「a要素ってsection要素を子要素にすることってできるんだっけ？」とか「h1要素ってdtのタグで囲んでいいんだっけ？」とか思ったときに調べるツールです。 使い方 以下にアクセス。 調べたい要素にマウスポインタを合わす 「親」と「子」が出てくるので、どちらかを押下 色が変わった要素が、その要素が取り得ることのできる要素 ガラケー以外の、だいたいの端末やブラウザで動くはずです。 制作経緯 こういったことが簡単にわかるサイトが見つからず（探しきれていないだけかもですが）、仕様書を見てもわかりづらい。 HTML 4.01 は、ブロック要素とインライン要素さえ覚えていれば、なんとかなりましたが、HTML5からは複雑になってしまいました。 そこで、「なければ作れ

普段、インターネット上ではただのゲーム好きとして活動（？）しておりますが、本職はWebサービスやスマートフォンアプリのUIデザイナーをやらせていただいております コウノ アスヤ（@asuyakono）です。 退勤後はイベントに登壇！土日はコンセプトデザインで習作！みたいな同僚を横目に、仕事の時間以外はもっぱら家にこもってゲームを遊び、プレイ後に感想を記事にしてネットに公開することが多いです。それがこのブログです。このブログではいつも「良いも悪いも正直に。なるべく平易な文で。」をモットーに書いてますが、記事のボリュームを考えたり、専門的すぎないように気をつけていると、どうしてもなくなく端折らざるを得ない話題というものがあります。 それは、ゲームにおける「インタラクション・デザイン」のことです。 「友達が少ない」「インドア」「両親が共働き」の３本揃いで、物心ついた時から１人で黙々とビデオゲーム

はじめまして。UIデザイナーのカミソルです。 わたしはOHAKO.incの受託事業の部署でサービスの体験設計からUIデザインをしています。 今回はSketchのSymbol機能を使って、デザインしながら効率よくガイドラインを作る方法について書きたいと思います！ ※この記事はSketch Advent Calendar 2017 19日目の記事です。 なぜデザインしながらガイドライン化したいのかガイドラインを作る目的は2つあります。 1.  エンジニアとの連携のため "カラーの種類"、"テキストスタイルの種類"、"画像として書き出すもの"、"コンポーネント"の4つがはっきり伝わるSketchデータにしたい。 2.  デザイン運用のため デザインを運用をするとき、誰でも追加や変更がしやすいようにしたい。「デザインしながら」とつけた理由は、デザインしていたら自然にガイドラインが出来ていた。という

※ 本記事は自分が運営しているブログに転載しています。 株式会社LITALICOでWebエンジニア（Rails）を担当しています、@YudaiTsukamotoです。 この記事は『LITALICO Advent Calendar 2017』14日目の記事です。 今回は、実務でペアプロを導入したことで、ペアプロへの考えが180度変わった話について書こうと思います。 はじめに この話は、弊社のとある新規プロジェクトの立ち上げで実際にペアプロを導入した話です。 プロジェクトでは初期メンバーとして私を含めた4人の開発者がアサインされました。過去のプロジェクトで比較的うまく機能していたアジャイルの導入や、ソフトウェアテスト・静的解析ツール等を徹底してコードの品質を担保するなど、アプリケーション開発する上での準備を入念に行いました。 そんな中、同じプロジェクトにアサインされた同期の@Takuan_Oi

「Avataaars Generator」はフラットデザインにマッチしたアバターが作成できるサイトです。顔のパーツを選ぶだけでアバターを作成してくれます。さまざまな表情が用意されており、膨大なパターンのアバターを作成できますよ。 Screenshot via Avataaars Generator「Random」ボタンを押すとランダムにアバターを作成してくれます。また、ベースとなるデザインから、服、目の色、口元、髪型などなど非常に細かい部分までカスタマイズが可能です。 ソーシャルサービス用のアバターを作りたいなという方はぜひ使ってみてはいかがでしょうか。きっとあなたにそっくりのアバターが作れると思います。 Image: Avataaars Generator Source: Avataaars Generator

「iconscout」は55万種類のベクターアイコンが手に入るサイトです。有償と無料のものが混じっていますが、膨大な量のベクターアイコンが揃っていますよ。iconscoutに登録すれば無料でダウンロードできるアイコンも多数あります。 Screenshot via iconscoutさまざまなアイコンパックがあり、中に含まれているアイコンはWeb上で一覧で確認できますよ。 Screenshot via iconscouticonscoutに無料登録すると、このようにフリーのアイコンはその場ですぐにダウンロードできます。SVGやAI、EPSなどベクター形式でダウンロードできますし、PNGでサイズを指定してダウンロードすることも可能。 膨大な量のアイコンが揃っているのできっとお目当てのものが見つかると思います。ぜひアイコン探しに困った際に使ってみてはいかがでしょうか。 Image: iconsc

しかしユーザーにとっては、期待外れの発表となったようだ。マルチカメラと引用機能は好反応だったが、それ以外の新機能は冷ややかに受け入れられた。 ユーザーの反応について川上会長は「niconicoが現状批判されているのは、画質の悪さと再生の重さの問題が改善されていないため。まだ改善していない段階で新機能が出ることに対しての反発があると思っている。画質と重さの改善と一部前後する部分があるが、両方とも進めていきたい」と話す。 niconicoへの不満としてよく挙げられるのが、「画質と重さの問題」と、「月額有料サービスのプレミアム会員でいることのメリットの薄さ」だ。プレミアム会員がサービスの収益を支えているモデルだが、会員数減に歯止めがかからない。大きな2つの不満に対して改善発表がなかったために、ユーザーは失望感を見せた。 新バージョンのリリースの遅れを川上会長は「本当に申し訳ない。『（く）』は失敗

今回は私が今までチームマネジメントやヒューマンマネジメントを通して学んだTIPSを整理してみたいと思います。 マネジメント(≒コミュニケーション)を支える技術について都度メモして、自分への戒めとして利用していたものを箇条書きにまとめました。 ある特定の状況だけでしか適用できないものが多いですが、応用はいろいろ効くと思っています。 マネジメントの立場にこれからチャレンジしていきたい人の一助になればと思ってます。 ※自分向けのメモを整理しただけなので、一般的にこうあるべきという内容ではありません。 会議編 -全員の参加を促そう 全員の発言機会が均等になっているか常に意識しよう 一言でも意見を言うことによって、その議題を決めたという意識を持てる - 自分自身(チーム自身)で決めたという感覚に落としもう 「決められたこと」ではなく、「自分たちで決めたこと」という意識を促そう その決定が実行されなか

WEB制作やシステム開発をしているとフローチャートを書くことも多く、専用のソフトウェアもリリースされていたりしますが、使い慣れたツールで創るのが一番早いという方も多いと思います。今日紹介するのはフローチャート作成のためのデザインキット「Flowchart kit for Sketch」です。 フローチャートに必要なデザイン素材をSketchで利用できるように、まとめて配布されています。 詳しくは以下 上記のように、フローチャート用に点線、実線、線の間にラベルが付けられたもの、エラーと成功のラベルなどなど、フローチャートの基礎要素が詰まっています。 Sketch形式で配布されていますので、自由にカスタマイズしながら利用ができるのが良いですね。こちらは全部で青、グレイ、黒と三種類のバージョンが無料で公開されており、ライセンスはCreative Commons Attribution 4.0 I

Site will be available soon. Thank you for your patience!

あれって、スター貰った時に意図的にその人の何かにスター付けてかないと一向に増えないよね？ それ以外にどういう経路で増やしてるんだか教えてください 頻繁にブログ書いて購読し合ってる仲だと自然とフレンドになりそうだけど 自分はブログ書いてないしそういう界隈に付き合いがないので