feb19.jp

Nobuhiro Takahashi
Designer / Engineer

アニメーションの調味料「イージング」の使い分けレシピ (透明度、UI、音量)

この記事は FLASHer Advent Calendar 2016 1日目の記事です。   FLASHer とは Adobe Flash (現 Adobe Animate) を使用している / 使用していたデザイナー、エンジニアの総称です。Flasher はそのまま訳すと「露出狂」という意味があります。 2016 年現在、前者 GEEK 民族の浄化が行われたので、インターネットで検索をかけると本来の意味での露出狂の画像が見ることができます。会社で検索をかけるのは気をつけて下さい。(なお、本当に露出していた伝説の FLASHer がいます。気になる方は [Flasher 露出] で検...

今年も Unframe 展やります(11.4-6)

懲りもせず、またグループ展 「Unframe Exhibition」やります。 11.4(金)-11.6(日)の中目黒のスペースで展示します。 ...

Mac OS X 用のスクリーンセーバー「Random Font Clock」を制作しました

Mac OS X 用のスクリーンセーバー「Random Font Clock」を制作しました。 お使いの Mac にインストールされているフォント全てをランダムに使用する時計です。 フォント好きの方にオススメです。 前回制作の Stacking Dots Clock 同様、 55→0 にカウントが変わる 5 秒間にちょっとしたアニメーションが発生します。 良かったらインストールして設定してみてください。...

Mac OS X 用のスクリーンセーバー「Stacking Dots Clock」を制作しました

Mac OS X 用のスクリーンセーバー「Stacking Dots Clock」を制作しました。 ドットが積まれていくミニマルな時計です。 59→0 にカウントが変わる 1 秒間にちょっとしたアニメーションが発生します。 良かったらインストールして設定してみてください。...

会員登録フォームにセキュリティ脆弱性を産む UI デザイン美人局

UI デザインのベストプラクティス集に時々「会員登録フォームを記入している時、メールアドレスがすでに登録されているかどうか示したほうが、何度も入力操作を行わないようにできるので良い」と書かれていることがあるのですが、これセキュリティの考え方的には間違っています。甘い物には毒がある・・美人局のようです。...

UI デザインのための Sketch Plugin「Font Size Checker」を作りました

iOS / Android 標準フォントサイズ外の指定がされたテキストレイヤーがないかチェックする Sketch プラグイン「Font Size Checker」を作成しました。UI デザインのリファクタリングツールです。 操作ミス等でアートボードに想定外なフォントサイズのテキストレイヤーが混入されていないか検知できます。...

iPhone / iPad 向けのクロマチックチューナーアプリ「Tuner」を作りました。

iPhone / iPad 向けのクロマチックチューナーアプリ「Tuner」を作りました。 無料でアプリストアからダウンロードできますので、ボイストレーニングや楽器の練習・音合わせにご利用くださいませ。...

実録・300 枚規模の画面を持つ全然リーンじゃないプロジェクトの UI デザインを Prott と InVision でプロトタイプ作った感想

友人と作っている某アプリの UI デザインをしてるときに Prott / InVision 使って感じた良いとこ悪いとこをまとめました。ご参考になりますと幸いです。 Sketch / Photoshop で作った画面をアップロードし、結線して遷移を再現し、みんなで共有するという使い方をした場合の比較です。...

数式作成ツール Math Type がめっちゃ便利

先日数学→ JavaScript に変換するコツとかを共有する勉強会を開いたのですが、その時に使った(知らなかった) Math Type という数式作成ツールが使い勝手もよく、最の高だったのでブログで愛をさけんでみます。 ...

愛と正義の必殺技『セマンティック・バージョニング』

OSS 界隈ではメジャーっぽいのですがセマンティック・バージョニングという必殺技っぽい名前の、バージョン番号付けのガイドラインがあるみたいです。 人間が判別しやすくなるという理由もありますが、プログラム側から判別できるようになり、RubyGems や CocoaPods 、 NPM などでもこのルールで更新されています。...

OOCSS BEM SMACSS FLOCSS 違い 無料

OOCSS BEM SMACSS FLOCCS は CSS コーディングルールです。ルールを標準化してメンテ性・チーム作業効率を高めていこうという動きで作られたものです。 これら以外にもありますが有名なのはこのあたりで、最近真面目に調べていなかったのでメモです(真面目に調べたとは言っていない)。 自分以外の誰が見てもわかり、メンテとかで CSS を編集しようと思った時に辛くならないようにルールを適用しておくと、モテるかもしれません。 キャンペーンやランディングページのコーディングは、なるべく早く終わらせたいのでこの辺は無視することが多かったですが、サービス開発とかで UI の微調整が何度も入る...

展示会 Reflection: インタラクティブなプロジェクションマッピング小品を出品します

明日より行われるイラストアート系展示会「Reflection」で、センサーやマイクを用いたインタラクティブなプロジェクションマッピング演出の小品を出展します。場違い...

楽譜がそろそろ Web 標準技術になるらしい

とはいえまだまだ先の話で、次の Chrome のナイトリービルドで追加されるというようなものではなく W3C でウェブ楽譜に関するコミュニティグループが作成され、議論が行われはじめたとのこと。...

不真面目に Material Design の配色する/Material Color Generator 作りました

Material Design は、色を決めてアイコンを作れば、一画面を構成する新規パーツをイラストレーターとかで新規作成しなくても、ほぼほぼ作れるようになっています。 Material Design で作られた Google 謹製のモバイルアプリ(Drive/Spreadsheet/Calendar/Analytics)を使いやすいと思ったことがあまりないのでやや疑問視しているのですが、個人的な感覚に過ぎないですしまだ真価が見出せていないだけかもしれないので、その辺は有耶無耶にして仕事をするのがサラリーマンの務めであります(サービス自体はお世話になりっぱなしです)。 そこで、その色の決め方...

re-n-da-n

UFEX003 Unframe Exhibition [ アンフレームエキシビジョン ] で re-n-da-n [ 連弾 ] という作品を展示しました。 最寄り駅からやや遠い会場で申し訳ありませんでした。ご来場いただいた方々はもちろん、行こうとしてくださった方もありがとうございました。 僕は今回、一曲のピアノ曲を複数人で演奏する「連弾」を ピアノが弾けない人でも気軽に行えるようにするためのものを制作しました。 re-n-da-n は 4 台のピアノ・キーボードを用いてセッションを行う作品・システムです。 セッションにピアノが弾けない・譜面が読めない方でも参加できるように 、 MIDI・ピア...