アイコン、ピクトグラム表示は本当にユーザビリティに優れているのか[デザイン] | おむすび
おむすび18号です！ 日用家電から公共物など、本当に様々な物に アイコンやピクトグラムやマーク（以下まとめてアイコンと言います）が使われていると思います。 そのアイコンを使用したもののユーザビリティについて考えました。 （細かくいえば、ピクトグラムやアイコンは違うものですが、 日常生活で見る事があるマークとしてまとめて話します。） そもそもアイコンの目的というのは 「文章で表現する代わりに、視覚的な図で表現することで、言語に制約されずに内容の伝達を直感的に行う」 というものです。 つまり 正しくアイコンを使うことが出来れば、 全世界の老若男女に言語を使わずに伝えることが出来る！ということ！ しかし、 最近思う事がありまして… 先日、85歳になる祖母に 「扇風機をつけたいけれど、どのボタンを押したらいいのか分からない」 と言われました。 扇風機だけでなく、エアコンや電子レンジ等、 一般的な家
![アイコン、ピクトグラム表示は本当にユーザビリティに優れているのか[デザイン] | おむすび](https://cdn-ak-scissors.b.st-hatena.com/image/square/a42cf582a7681fcd385a983967f281d172f93374/height=288;version=1;width=512/https%3A%2F%2Fweb-omusubi.com%2Fupload%2Fm_2015340801042834.jpg)
Yahoo!チャットって場所があったんだよ
昔さ、Yahoo!チャットって場所があったんだよ。お前は知らないかもしれないがな。 当時はみんなホームページってやつを持っててな、誰が読むんだかしらねえ自己紹介とか何番目の訪問者です！ってのやっててな、ひどいとこになると熊のアイコンみたいなのがビュンビュンとカーソルを追いかけてくんだ。ありゃ恐怖だったね。 誰が興味あるんだかしらねえ、使用パソコンのスペック書くヤツまでいてな、「CPU: PentiumII、350MHz」とかドヤ顔で書いてたんだよ。タワー型のパソコンの写真まで載せてな。なんのため？しらねえよ、本人に聞け。 でな、そういうところには必ず掲示板ってやつがあってな。BBSとか言ってたな。山陰放送じゃねえぞ。で、キリバン踏んだらBBSに報告することが義務付けられてて、しなかったら末代まで祟られて呪詛にかけられるんだけど、熱心なヤツになるとチャットっていう、リアルタイムに文字でお喋り
2015年、Web制作者が押さえておきたいCSSの各種リセット、アニメーション、フレームワーク、アイコンのまとめ
制作時に欠かせないリセット用のCSS、ページのグリッドやレイアウト・コンポーネントが用意されたフレームワーク、クリック・タップやホバーやスクロールを楽しませるアニメーション、モバイルにもフレンドリーなCSSでつくられたアイコンなど、ゼロから用意するのはかなり大変なCSSの便利なフレームワークを紹介します。 リセット用のCSSはこの3種類 レスポンシブ対応の定番フレームワーク Material Designに対応したフレームワーク さまざまなアニメーションが簡単に実装できるCSS かわいいアニメーションを使ったローダー 使いやすいアイコンフォント・Pure CSSのアイコン リセット用のCSSはこの3種類 HTMLの各要素のブラウザごとに異なる差異をなくし、意図した通りに実装できるようスタイルをリセットするスタイルシート。 Reset CSS 2.0 HTMLの各要素のmarginやpadd
ドラゴンボールZのエンディングテーマを逆再生すると制作秘話が聴ける | attrip
この動画は、再生したバージョンと逆再生したバージョンを重ねたものです。こんな風にいってたのか。。。 書き起こしあー、この曲をつくるにあたっては、 清水賢治、池毅（いけたけし）、トキエダタツヒロ、ウチダタカシ、ヤマモケンジ ヤナギハナエ？ ノムラタカシががんばったんだ。がんばったんだよ！ ※清水賢治は、フジテレビのプロデューサー ※いけたけしは、1980年代後半から活躍するアニソン作曲家であり、彼が手がけた楽曲は2000以上に上る。楽曲の特徴として、OPのようなEDの楽曲が多い。また、「いけたけし」名義で歌手活動もしている。 いけたけしさんのサイトには、秘話が書かれていた。ボーカルのManna（マナ）さんのキュートでチャーミングなボーカル録音が無事終わり、彼女がお帰りになった後、コーラスパートやガヤ（かけ声）を私が一人多重録音で入れたのだが、曲をさらに面白くしたくなり、イントロや間奏に意味不
iTunes Matchで古いMP3の音質を大幅アップさせる方法
Tunes Matchを使って古いMP3を最新のAACフォーマットにグレードアップできたので、方法をメモ。 iTunes Matchのメリットは２つ。 iPhoneやiPad、Mac、PCでクラウド上の楽曲をダウンロード・ストリーミング再生できる 手持ちの楽曲ファイルがサーバーのとマッチした場合に256bpsのAAC形式になる iTunes MatchはiTunes Cloudとは違って、1年単位（アメリカでは年間24.99ドル、日本では3,980円）で購読するサービスです。私は開始直後の2011年からアメリカで使ってます。2013年12月には北欧でもサービスが開始されました。日本では2014年5月になって、ようやくサービス開始されました。 1点目のメリットは契約が終了すると終わり、ダウンロードやストリーム再生ができなくなります。 2点目のメリットは、ファイルをダウンロードしておけば、ずっ
高コンバージョンを保つウェブサイトが採用する5つの行動心理学テクと実例|グロースハックジャパン|Growth Hack Japan
7/25最新記事 見落とされがちなオフライン上での3つのリファラルチャンス edited by Ryutaro Mori 過去に何度もお伝えしてきた行動心理学を利用したコンバージョン最適化テクニック。 本日は、growth hack japanの中でまだお伝えしてなかった行動心理学テクを、実例とともに5つ紹介します。 参考:5 Psychological Principles of High Converting Websites プレグナンツの法則 プレグナンツの法則によると、人間は明確で順序だった物事を好み、複雑なアイディアやデザインを恐れる傾向にあります。 シンプルなものほど予期せぬ不快なサプライズを引き起こしにくいということを本能的に感じ取り、それに従ってシンプルに物事を解釈する人間の傾向を表しています。 例えば以下の英文を見てみましょう。 ① Welcome to growth
【保存版】デザインにも提案資料にも "めっちゃ使える" 無料のアイコン素材サイト17選
どうも、平成の☆ やな☆ぎさわです。 デザインや資料作成などで素敵なアイコンをサクッと配置したり、ワンポイントで使いたい時ってありますよね。 そんなとき、自分で作ると時間がかかるし、そもそも作れないよぉなんて悩んでる方は多いのではないでしょうか。というわけで、王道中の王道ですが、今回は素敵なアイコンサイトのご紹介と行きたいと思います。 もはや何番煎じだかわからないからこそ、全力で厳選しました。ぜひ。 ありとあらゆるアイコンが無料＆超激安で手に入る金字塔的サイト「ICONFINDER」 ICONFINDER >>サイトはコチラ 僕は、資料を作る際に必ずと言っていいほどこのサイトに依存してます。 検索は英語限定ですが、JPG、PNG形式はもちろん、ベクターデータや3D系まで異常なほど豊富なアイコン収録数が魅力。 本職のデザイナーさんでここを知らないって人はもはやいないと思いますが、非デザイナー
アイコンフォントからSVGへ！より手軽にベクター画像を表示しよう
2014年7月3日 SVG ベクター画像を表示する際とっても便利なSVG。名前を聞いたことのある方も多いのではないでしょうか？SVG自体は10年以上前から存在するのですが、HTML5の普及とともに多くのブラウザーでサポートされるようになり、今年に入ってから徐々に見かける機会が増えてきました。今回はそんなSVGにフォーカスしようと思います。 ↑私が10年以上利用している会計ソフト！ 2014年7月3日 追記：SVGスプライトの書き方について修正＆追記しました。 SVGってなに？ SVG（Scalable Vector Graphics）はIllustratorで作成したようなベクター画像を表示する技術です。Web上で一般的に使われる画像形式であるJPEGやPNGなどのビットマップ形式とは違い、ベクター形式の画像は、拡大縮小しても画質が劣化しません。 Appleがレティナディスプレイを発表して
今年のお盆はオンライン墓参り！代行で合掌や献花もZoomで作法も服装大丈夫！
現在でも、新型コロナウイルスの影響がすごいですからお盆期間の墓参りもオンラインということで話題になっているようです。 何でもかんでもオンラインというのは現状では仕方のないことですが、墓参りもということについてはびっくりしました。 オンライン墓参りというのは何だか罰当たりな気持ちでありますが、里帰りできない点ということを考えると自宅のお墓の様子など確認できることはいいことです。 オンライン墓参りでは、Zoomを使用をしてしてくれるそうなので「オンライン帰省」「オンライン飲み会」と言った感じでできることはいいですね。 オンライン墓参りのサービスは、ネットニュースで話題になっているのでわかると思いますが「有限会社かの石材」という広島県福山市にある墓石店がしたそうです。 こういったサービスを思い付くのがすごいなと思いますが、15年前から墓の掃除代行サービスをしていたようです。 それが、世の中大変な
1,000通り以上の組み合わせが可能なフェイスアイコン「Avatars and Emoticons Vector Set」
アイコンで表現されることも多い人の顔のビジュアル。同じテイストで何種類も描き出すのはとても大変な作業になってしまいます。そんなシーンに是非利用したい、1,000通り以上の組み合わせが可能なフェイスアイコン「Avatars and Emoticons Vector Set」を今回は紹介したいと思います。 いろいろな表情や髪型のフェイスアイコンが簡単に作り出せるパーツがセットになった、とても便利なフリー素材です。 詳しくは以下 セットになっているのは、帽子やメガネなどの装飾パーツ、目・口・鼻の多彩な表情が楽しめるバリエーションパーツ、女性・男性のいろんな髪型パーツ、フェイスラインパーツ。好きなものを選び重ねていくことで、人のフェイスアイコンが完成します。ユニークなデザインのパーツが多く、楽しみながらフェイス作りを楽しむことができそうです。 他にはあまりない貴重な素材だと思いますので、オリジナル
デザイン時に気を付けたい目的と手段の取り違え
デザインする時、手段ばかり追ってしまい、「( ﾟдﾟ)ﾊｯ!そもそもの目的ってなんだっけ」ってなりがちなので、気を付けたいなと思いまとめてみました。 1. 目的をしっかりと認識する 例えば、上のようなボタンをデザインしたとき、「もっと目立つように大きく、色も赤とか目立つ色にしてください」という修正指示を受けたとします。 「目立たせる」という目的の解決策として、「大きくする」、「赤などの目立つ色を使う」という2つが考えられています。そしていつの間にか、これらの解決索が目的にすり替わっていることが無いでしょうか。 「大きくする」、「赤などの目立つ色を使う」ことを行えば目的を達成できるかのように錯覚するのですが、その解決策は本当に最適かを考える必要があります。そもそもの目的は「ボタンを目立たせること」で、その解決策は他にもあります。 2. 他の手段も考える 「目立たせる」ためには、差別化する、近
We Love Icon Fonts
We Love Icon Fonts We must stop here, this is icon fonts country! What? This is a free & open source icon fonts hosting service (like Google Web Fonts, but icon fonts only). Hurray! Caution! This is a public gamma. Use this service for mockups, reduced test-cases or CodePens, but not on productive systems!
svchost.exeのプロセスの中身が何かを調べて表示するフリーソフト「Svchost Process Analyzer」
svchost.exeはWindowsの中で最もミステリアスなプロセスの1つ。DLLで走るホストプロセスの総称であり、多くのプロセスで使用されるsvchost.exeですが、ウイルスなどもこのファイルを使い、その活動内容を隠したりします。 無料で利用可能な「Svchost Process Analyzer」では、全ての実行中svchost.exeファイルをリスト化し、そのプロセスをチェック、これによりWindowsを狙ったマルウェアであるConfickerのようなワームを発見しやすくなります。 Svchost Process Analyzer - a svchost.exe file checker http://www.neuber.com/free/svchost-analyzer/index.html 「Ctrl+Alt+Del」キーの同時押しで起動可能な、Windowsタスクマネー
Illustratorテクニックとフリー素材まとめ | コムテブログ
作成：2013/10/21 更新：2014/11/01 無料素材 > フリー素材は沢山あるけれど、どこに何があるか分かりにくい。ロゴやイラストを作るのにまたあのサイトを探さないといけない。そういったことで１回まとめました。今回厳選したつもりですが、それでも量が膨大になったので簡潔にリストアップしてます。 エンジニア速報は Twitter の@commteで配信しています。 もくじ フリー素材まとめ ダウンロードしておきたいフリー素材一覧 Illustrator のチュートリアル 小技 基本テクニック フリー素材まとめ ダウンロードしておきたいフリー素材一覧 ロゴやイラストを作ったりするときに役に立ちそうなアイコン、ベクター、背景、テクスチャ素材をまとめました。少し変わったモノが多いですが、筆者が何度もアクセスしてしまうブクマ一覧です。 学校や教育関係／アイテム全200種類のアイコン素材 -
Google画像検索で高解像度のロゴのみをザクザク見る
ロゴ制作時に使えるTIPSをご紹介。 アイデア捻出とかでロゴをザーッと見たいとき、Google画像検索で検索ワードに「logo」とか入れて検索すると思います。 そこに「filetype:svg」を追加してファイル形式を「SVGファイル」のみに制限することで、高解像度のロゴのみを検索できます。 サンプル でも、SVGファイルって何でしょうか? SVGファイルってなんなのさ SVGフォーマットはJPEGやPNGなどのピクセル形式の画像ファイルとは違い、イラストレーターのようなベクターデータ。つまり何処までも拡大できます。なので正確には高解像度というのは間違い。 Webページにベクターデータを埋め込む用途を意識して開発されたので、中身はXMLで書かれてます。つまり普通にテキストエディタで開けば直接データが見えます。もちろん編集もできます。 ウィキに掲載されてるロゴはSVGファイルの場合が多いです
国内で最もソーシャルメディアを活用しているローソン、その成功事例と手法がとても参考になりました（セミナーレポート）-Six Apart ブログ｜オウンドメディア運営者のための実践的情報とコミュニティ
TOP > 国内で最もソーシャルメディアを活用しているローソン、その成功事例と手法がとても参考になりました（セミナーレポート） こんにちは。マーケティング担当の高橋です。 先月、日経デジタルマーケティング主催のセミナー「ソーシャルメディアを売上貢献に結びつける成功の秘訣」に参加してきました。 （1ヶ月以上前の話で大変恐縮ですが）国内で最もソーシャルメディアを使いこなしている企業であろうローソンのソーシャルメディア活用事例の話（ローソンの広告販促企画部兼CRM推進部アシスタントマネジャーの白井明子氏による講演）がとても参考になったので簡単にまとめてみようと思います。 ローソンで利用しているソーシャルメディアはなんと21媒体！ Twitter Facebook Google + mixi ページ Youtube ニコニコ動画 NAVER まとめ（初の企業クライアントに） Pinterest T
無料で商用でも利用OKなWebdesigner Depotのアイコン集「Kaching」「Childish」「Buddycons」「Reflection」などなどとにかくいっぱい
イーコマース用のアイコン「Kaching」、子ども向けウェブサイト用のアイコン「Childish」、各種ソーシャルメディアのアイコンをベクター形式で揃えた「Buddycons」、モノクロベースで208種類もある実用アイコン「Reflection」、ベクター形式のソースファイルを同梱したRSS用のアイコン「Supra」、ブルーとブラックを基調にしたベクター形式も収録済みのアイコン「Primo」、ベクター形式とPNG形式の両方を揃えたTwitter用各種アイコンセットなどなど、とにかく山ほど無料で商用利用も可能なオリジナルデザインのアイコンを配布しているのがウェブデザインを扱うブログ「Webdesigner Depot」です。 というわけで、各種アイコンのダウンロードは以下から。 Kaching - Exclusive Free eCommerce Icons | Webdesigner De
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【Photoshop入門】Webデザインをはじめよう！第1回 デザイン前に覚えておきたい環境設定とレイヤー機能 - Adobe Blog
http://shingekidesign.com/?p=116
SNSやブログのプロフィール画像のピクセルサイズまとめ