Life is bitter

日常生活で考えたことやデザイン・写真・インテリアをはじめとした役に立ちそうな知識をまとめて記しています。

Clickableなボタンであるためのあれこれ

f:id:life-is-bitter:20170904165014j:plain

最近、UIデザインをしていく中でClickableな(クリックできる)ボタンのアフォーダンスについて悶々と思考を巡らせてしまいます。

「果たしてこのボタンはクリックできるものだと認識してくれるだろうか?」「う〜んギリギリ認識してくれるか…?」という自問自答にはじまり、「そもそもこれボタンに見えるのか?」「ボタンっぽいコンポーネントだけどこの機能の中ではクリックできる(すべき)ところではないんだよな...」などなど思考の沼にはまりながらUIデザインをしています。

いま手がけているのはPC向けのUIなのでもちろん入力インターフェースはマウスであり、Clickable or notがユーザビリティに直結するのですが、今回はClickableなボタンであるために必要なことを自分用に整理してみました。

続きを読む

Airbnbとエアアジアで格安なのに上質だった3泊5日バリ島旅行

f:id:life-is-bitter:20170831154316j:plain

7月の頭にバリ島へと旅行に行ってきました。
ことの発端は私が「リゾートでバカンスしたすぎる」と研究室の同期へ軽い気持ちで言ったことで、トントン拍子で「じゃあ行こうよ」と決まってしまい、かなりふわっとしたノリでバリ島へと飛んでしまいました。

海外旅行は行くたびに準備の段階や現地での気付きで新しい発見があるので、今回は他の人もおトクでかしこくバリ島を満喫できるよう、旅行記をまとめてみたいと思います。

続きを読む

BtoBサービスのUIデザインをする上でのリファレンスまとめ

f:id:life-is-bitter:20170704104931j:plain

つい最近、ご縁がありましてBtoB向けのサービスの開発にUIデザイナーでジョインすることになったのですが、BtoB向けのサービスにおけるUIデザインというものがはじめての経験です(しかもスタートアップ、スタートアップでの開発もはじめて)。

で、本格的にコミットしていく前にある程度予備知識というか最低限気をつけておかなければならないことやバリエーション出しのためのリファレンスが欲しいなと感じたので自分用にまとめることにしました。

続きを読む

シルクスクリーンでバリ島旅行のためにクソTシャツを作りました

f:id:life-is-bitter:20170701190452j:plain

実は今週から5日間ほど研究室の同期とバリ島へ旅行するのですが、こうした海外旅行(特に南の島)に行くときに欠かせないのがクソTシャツ作り。いきなりパワーワードが出てきてしまいましたが旅行へのモチベーションを上げるためのアイテムであり儀式でもあります。

このクソTシャツ、どういったものかと言いますと頭の悪そうなデザインを高いクオリティでまとめてあるTシャツのことでして、スキルの無駄遣い感が否めないとの声もちらほら...。

デザインを決めたら無地のTシャツにシルクスクリーンで印刷するだけなのですが、今回はSURIMACCAというシルクスクリーンキット&サービスを利用してみて非常にお手軽に制作できたのでご紹介します。

続きを読む

Google Search ConsoleとAnalyticsでリライトすべき記事を探す方法

f:id:life-is-bitter:20170701160721j:plain

検索流入を増やすための方法のひとつとしてタイトルおよびコンテンツのリライトという方法があります。追加で関連する情報を載せたりそもそもの内容を変えたりとどうリライトするかは人それぞれ記事にもよる、としか言えませんがリライトする上でもっとも困るのがどの記事をどうリライトすべきかということ。

www.procrasist.com

先日、非常に貴重なデータと共によくまとめられたリライト戦略に関する記事を見つけました。
自分も記事のリライトをしてもっと流入を増やしたいと意気込んだのですが、もう少し具体的にどんな特徴を持った記事をリライトすべきかがわからないなと感じたので、今回はGoogle Search Consoleに加えてGoogle Analyticsも使い、補足的にリライトすべき記事を探す方法とどうリライトすべきかを自分なりにまとめてみました。

続きを読む

はてなブログの固定ページでポートフォリオを作りました

f:id:life-is-bitter:20170630173740j:plain

先日はてなブログにもようやく固定ページを作る機能が実装されて、WordPressのような自由度へと一歩近づきました。前々からWordPressあたりでポートフォリオをWEB上にもまとめておくか、と思っていたのですがちょうどいい機会なので今回はてなブログの固定ページでポートフォリオを作ってみました。

先に感想を言っておくとCSS設定が煩わしく、見せ方にこだわりがある人はWordPressで作った方がトータルでの作業量は少ないかと思います。とりあえず、どう作ったかについて備忘録がてら残しておきます。

続きを読む

ブログのデザインをリニューアルしました

f:id:life-is-bitter:20170627103855j:plain

このブログをはじめてから大体1年2ヶ月ほどなのですが、一念発起してブログのデザインをリニューアルしました。
今までははてなブログテーマの中でも人気のDUDEを利用してそれを改造していたのですが、回遊率の悪さやアイキャッチを効果的に訴求できていない、そしてレスポンシブ対応していないのでスマホサイト表示がちょっとダサいという点が問題だなと感じていまして、勢いにまかせて全て解決してやろう!とリニューアルに取り組みました。

個人でできるサイトUX改善PDCAというスローガンのもと、今回はどういう意図でどう変えたのか記録しておき、後々数値としてどう改善されたかレポートしたいと考えているのでリニューアル概要についてまとめました。

続きを読む

【初心者】Origami StudioでTinderUIの動きをプロトタイピングする【基礎】

f:id:life-is-bitter:20170621211601j:plain

UIおよびアプリ全体の流れにおけるUXを検証するとき、プロトタイピングツールは必須となっています。数多くのプロトタイピングツールが存在する中で、アニメーションの動きを細かく検証できる強みを持つものとしてOrigami Studioがあることをご存知でしょうか?

Facebookからリリースされているこのプロトタイピングツールですが、他のプロトタイピングツールと比べて学習コストが高い代わりに細かくインタラクションを設定して精度の高い検証ができることが特徴です。

今回は、Origami Studioを使って近年流行りであるTinderUIの動きをプロトタイピングすることで、Origami Studioの基礎的な使い方とテクニックをチュートリアル形式で紹介できればと思います。

続きを読む

クリエイターの生産性を格段に上げるガジェット10選 in rakunew

f:id:life-is-bitter:20170704104758j:plain

近年、次々と出てくるガジェットの多くは非常にクリエイティブなものばかりでクリエイターにとっては「こんなモノを待っていた!」と思わず喜んでしまうようなものまであります。

ガジェット好きな私は常々クラウドファンディングサイトやrakunewなどの最新のガジェットを扱うサイトを覗いていまして、何かいいモノはないかなとチェックしているのですが、ある程度欲しいものリストが貯まってきたので、今回はrakunewで買えるクリエイターの生産性を格段に上げるガジェットというテーマでおすすめのもの(つまるところ私が非常に欲しいもの)を紹介していきたいと思います。

お金が貯まったら買うぞ...!!

続きを読む

【Swift】変数を定義するときのデータ型早見表を作った【初心者】

f:id:life-is-bitter:20170618210755j:plain

現在、私はSwiftでのiOSアプリ開発をUdemyの動画にて勉強しているのですが、正直なところプログラミングをする上で必要な基本的な知識すらままならないのが現状です。

先程は変数(or定数)を定義するときにデータ型なんていうものを宣言しなければならないということを学んだのですが、IntやらFloatやらどれが何に対応しているんだっけ?と混乱してしまい、わからないことをわからないままにしておくのが気持ち悪いので一目でわかるようにデータ型早見表を作りました。

続きを読む