ノンデザイナーがもっと知りたい！センスより大切なデザイン心理学のルール＋3つ
「購入ボタンは緑色がいいって専門家が言っている」「いや、Amazonのオレンジだ」なんて不毛な議論をしていませんか？ ディレクターやエンジニアにも役立つ、Webデザインで使える心理学のルールを3つ紹介します。 『ノンデザイナーこそ知っておきたい！デザインでセンスより大切な心理学のルール』では、Webサイトの成果を大幅に改善してくれる4つの有名な心理学ルールについて説明しました。今回は、色や人間の注意力持続時間、反応を研究したさらに3つの心理学ルールを紹介します。そして、ルールに沿ってWebサイトを改善し、より大きな成功を得る方法について説明します。 では、始めます。 ルール1：人間が注意力を持続できる時間は、毎年短くなっている 2015年、Microsoftは2000人の被験者を対象とする調査を実行し（調査結果PDF）、脳波記録装置を使って112人以上の人びとの脳活用をモニタリングしました
UX課題を”つくる前”に改善！インド発の無料プロトタイピングツールが、人間の仕事を本気で奪いにきてる | Ledge.ai
TOP > Technology > 注目テクノロジー > UX課題を”つくる前”に改善！インド発の無料プロトタイピングツールが、人間の仕事を本気で奪いにきてる こんばんは、イイノです。 つい先日にはAdobeXdのプレビュー版がリリース。プロトタイプが本格的に現場に浸透するぞー！なんて、話題になってますが、個人的にはXdを超える？なんて思えるプロトタイピングツールを発見してしまったので、紹介してみようかなと。 これまでのプロトタイピングツールでは難しかった『複数人プロトタイピングでの挙動をトラッキング分析』や、『個別＆全体での行動をレポーティング』といった機能を搭載し、なんと無料で利用可能にしてしまったという衝撃のツール『CanvasFlip』。 インドの天才たちが作ってくれたこのツールで、プロトタイピングとユーザーテストの手順や手間やコスト、その他もろもろな常識が変わってしまう？…かも
UIデザインのアニメーションまで共有できるモック作成ツールまとめ | Goodpatch Blog
先日、Goodpatch代表の土屋がWebSig会議というイベントで講演をしました。講演は「ハートに響くUIを生み出すためのデザインプロセス」というタイトルで行われ、起業までのストーリー、GoodpatchのUI設計プロセスなどについて話しました。講演内容は↓のslideshareを参照してください。 その講演の中でGoodpatchはデザインする際にプロトタイプを作成していると話しました。以前にMEMOPATCHでもインタラクションや導線の動きを伝える上でプロトタイプ作成が重要という趣旨の記事をアップしています。 （参考: これからのUIデザインのために、デザインカンプをやめてプロトタイプを作ろう（前編）, （後編）） プロトタイプ作成というとHTML, CSS, JavaScriptで実装する方法がメジャーかと思いますが、これだとリソースをかなり割くことになってしまいます。そこで今回は
WEBデザインが独学で身につく！WEBデザイナー必見の神サイト20選
2023年2月17日 Webデザイナー1年生はもちろん、Web製作に携わるものなら絶対に知っておきたい神サイトを完全収録しました。 独学でWebデザインを勉強したい人、優秀な先駆者たちの知恵を吸収し飛躍したい人は要チェック。 WEBデザイナー必見の神サイト20コリスWebクリエイターボックスコムテブログかちびと.netバンクーバーのうぇぶ屋ホームページを作る人のネタ帳creive【クリーブ】BlackFlagDesignDevelopArchAteitexe アテークゼウェビメモWebparkNxWorldデザイナーのイラストノート株式会社LIGMdN Design InteractiveドットインストールProgateschooコリス コリス サイト制作に関する最新の情報をご紹介 サイト構築、WordPressのTipsを得られます。ただし、Webデザイナー１年制が、今からの更新情報を受
無料でブログ・SNS投稿に使えるCC＆パブリックドメインの画像サイト40選
ブログやSNSの投稿に写真や画像を使うことがありますが、著作者に無断で写真やイラストを使用することで著作権の侵害にあたることも。そこでSNS予約投稿サービス「Buffer」が、無料でブログやSNS投稿に使えるCC(クリエイティブ・コモンズ・ライセンス)＆パブリックドメインのストックフォトサイトや検索ツールなどを大量にまとめています。 53+ Free Image Sources For Your Blog and Social Media Posts http://blog.bufferapp.com/free-image-sources-list ◆写真検索サイト 01：More Free Images & Free Stock Photos | Download Free Stock Photography from Dreamstime 無料アカウントの作成が必要ですが、無料でダウン
2014年に必須、マルチスクリーンユーザーに対応したウェブサイトの構築
[対象: 中〜上級] スマートフォンやタブレット、パソコンやテレビなどの様々なサイズのスクリーンを持つ複数のデバイスからユーザーがアクセスする状況が一般的になりました。 いわゆる「マルチスクリーン」と呼ばれる時代の到来です。 そこでGoogleは、マルチスクリーンに対応したウェブサイトを構築するための指針を10月に公開しました（PDFでダウンロード可）。 この指針の中核となる1〜4章を日本語訳しました。 マルチスクリーン時代に適合したウェブサイトを構築する際の参考にしてください（長いのでブックマークしておいて、年末年始の時間が取れるときに読むといいかもしれません）。 1. モバイルに備える マルチスクリーンの戦略はユーザーのニーズと自分のビジネスに適合している必要があります。あなたのサイトでユーザーはどんなことをやり遂げたいのでしょうか？ 何をユーザーは期待しているのでしょうか？ ユーザー
レスポンシブWebデザインがユーザー体験に最適化できていない5つの実例 - SEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
無料で資料をダウンロード SEOサービスのご案内 専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。 無料ダウンロードする ＞＞ スマホの普及で導入サイトも増えているレスポンシブWebデザイン。作り手からするとまだまだ目新しいですし、ブラウザサイズを変えてサクッとデザインが柔軟に変わるのはそれなりに自己満足度も高く時代の最先端を走っている気分になれる仕組みではあります。一方、デバイスやスクリーンサイズにデザインが最適化できたとしても、それがそのデバイスを使っているユーザーに本当に最適化できているかというと、全くの別問題。Google先生も大推奨中ということで、今後さらに導入が進んでいくと思われるレスポンシブWebデザインですが、今回はそんなレスポンシブWebデザインが抱えるユーザー視点の問題点や課題を真剣に考えてみた記事を
ノンデザイナーズデザインブックを読み解く // Speaker Deck
MIND HACKSとインタフェースデザインの心理学を引用しながら、デザインの基本4原則を解説していきます。 ==================== あわせて読みたい ==================== 少ない手間と知識で”それなり”に見せる、ズルいデザインテクニック http…
PCサイトスマホ変換「shutto（シュット）」サービス終了
shutto（シュット）サービス終了 PCサイトのスマホ変換サービス「shutto（シュット）」は、2024年3月31日をもってサービスを終了しました。 今まで多くのお客様にご愛顧いただきましたこと、スタッフ一同深くお礼申し上げます。 ※Webサイト多言語化ツール「shutto翻訳」は「shutto」とは別サービスとなります。 「shutto」はサービス終了となりますが、「shutto翻訳」には影響ございません。 「shutto翻訳」はこちら shutto終了後のスマートフォン変換にお困りの方 株式会社アイスリーデザイン様が提供している「flamingo」サービスでスマートフォン変換が可能です。 詳細は株式会社アイスリーデザイン様にご確認ください。 ■「flamingo」に関してのお問い合わせ先 株式会社アイスリーデザイン 営業本部： 担当 原島(はらしま)/野林（のばやし） お電話でのお
ホームページビルダーを無料でお探しなら＞ホームページ作成ツール19個
1500以上の会社、お店が利用中の月額無料HP制作サービス 「HPの制作を安心して任せられる業者が見つからない＞＜」 そんなふうに頭を悩ますアナタ。 以下の「ウェブさえパック」はもうチェック済みですか？ HPを作るのに必要なものがパッケージになってるお得なサービスです。 料金と事例を見てみる 【発表】最新のHP作成方法はこちらへ ホームページビルダーを無料でお探しのあなた。 ホームページビルダーといえば、これ↓ 「ジャストシステムのホームページビルダー」なら、こちらですぐにダウンロードできます。 しかし、焦らずちょっと待ってください。 web制作歴14年目の僕は、ジャストシステムのホームページビルダーをおすすめしません。 なぜなら、このJustSystemホームページビルダーには以下のようなデメリットがあるからです。 ダウンロードしてからインストールするのが面倒 レンタルサーバーも必要。そ
日本のスマホサイトは2年間でこんなに変わった (1/4)
スマートフォンやタブレット端末といった、いわゆる「スマートデバイス」を意識したWebサイト制作はもはや常識となっている。各企業のWebサイトは、次のような方法でスマートデバイスに対応していることがほとんどだろう。 スマートフォン向け専用サイトを構築する レスポンシブWebデザインで Webサイトを構築する viewportを調整する Web Professionalでは、2011年2月、有名企業のWebサイトがスマートフォンにどのように対応しているかを紹介した。 これらのサイトは、2年経ってどのような変化を遂げたのか。本記事では、取り上げたサイトに再び訪れ、サイトデザインのトレンドがどう移り変わったのかを観察。日本のスマホサイトの「BEFORE & AFTER」を紹介しよう。 半数以上のサイトがリニューアル まず、調査したサイト数に対してリニューアルしたサイトと、大きくは変化していないサイ
新規サイトを立ち上げる前に知っておきたい29個のアドバイス
[対象: 全員] 新しいサイトを立ち上げるときに役立つ29個のアドバイスをWebmasterWorldでフォーラムモデレータが提供してくれました。 僕たちにとってとても価値ある情報なので共有します。 新しいウェブサイトを公開するときに役立つ29のアドバイス 互換性の問題を後になって生じさせない良いCMS（コンテンツ・マネジメント・システム）で始める フレームワークとプラグイン、アドオンの使用を最低限に抑える ―― 今日はすごくいいものでも明日には頭痛の種になることがある ユーザーにとっては見やすく検索エンジンに対しては短いURLを付けることに重点を置く 粗末なリンクを獲得しないようにする ―― 長期的に見て危険過ぎるし後になって取り除くのにうんざりするほど時間がかかる すでにある他の100のサイトにないどんなものを新しいサイトが提供するのかを自問自答してみる 最初の1年間は、Googleの
[デザイン]角丸を使う理由、不自然な角丸について徹底的に分析した
角丸の話題が盛り上がってましたね 先々週webデザイナーである彩さん(@maritime_color)のブログDesign Colorで、角丸をどういう場合に使うか、という記事がすごい話題になってました！ デザイン時に注意したい角丸の使いかた | Design Color そしてその後、ナナメウエの変態イラレラー(褒めてます)すずきさん(@suzukisan__)もそれに続き角丸に触れる記事を書いたりしていました。 illustratorで角丸を扱う際の注意点 ※追記しました | ナナメウエblog 私も以前デザインが苦手な人も分かる「デザインは全て意味がある」6つの要素という記事を書いたとき、角丸についてはさらっと触れるに留めたのですが、いずれもっとがっつり言語化したいものだと考えていました。 気になることもあったし、ちょうど良いので今回便乗して記事にしてみようと思います。 形状としての
![[デザイン]角丸を使う理由、不自然な角丸について徹底的に分析した](https://cdn-ak-scissors.b.st-hatena.com/image/square/9068d7a52b34c4de9a5be296ee0a927a28903d59/height=288;version=1;width=512/http%3A%2F%2Fwebcre8.jp%2Fwordpress%2Fwp-content%2Fuploads%2F2013%2F02%2Fdesign-rounded-corner-13-150x150.png)
レスポンシブ・ウェブデザイン - メディアクエリのパワーを使いこなす
+1 ボタン 2 AMP 11 API 3 App Indexing 8 CAPTCHA 1 Chrome 2 First Click Free 1 Google アシスタント 1 Google ニュース 1 Google プレイス 2 Javascript 1 Lighthouse 4 Merchant Center 8 NoHacked 4 PageSpeed Insights 1 reCAPTCHA v3 1 Search Console 101 speed 1 イベント 25 ウェブマスターガイドライン 57 ウェブマスタークイズ 2 ウェブマスターツール 83 ウェブマスターフォーラム 10 オートコンプリート 1 お知らせ 69 クロールとインデックス 75 サイトクリニック 4 サイトマップ 15 しごと検索 1 スマートフォン 11 セーフブラウジング 5 セキュリティ 1
ロゴストック
section of your WordPress site. For example, you could include a style like this: Don't forget to put your content outside of this comment block (duh!). Although, it would probably be best to remove this whole dang thing before you go live (other- wise, this comment block will be outputted along with your content). ============================================================-->
私が売れるランディングページを作れる様になる迄の3年で学んだ7つの事
ユーザーに届ける価値を徹底的に追求する マーケティングを提供します © Copyright 2022 バズ部. All rights reserved. ランディングページは、商品の売上にダイレクトに影響する重要なものだ。それだけに、じっくりと時間をかけて、長期的に安定した売上を出せるものにする必要がある。 私は、今でこそ、コンスタントに高いコンバージョンを出せるようになったが、そこまでの道は決して簡単ではなかった。 そして、過去の私と同じように、高いコンバージョンを出せずに悩んでいる方は多いだろうと思う。 そこで、本日は、私が売れるランディングページを作れるようになるまでの３年間で学んだ７つの気付きをシェアさせて頂こうと思う。 また、私たちバズ部は12年で400社以上のメディア支援を行い、 立ち上げから10ヶ月で14.6億円の売上を産んだ不動産メディア8ヶ月で月間140万PVを実現したア
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【前編】エンジニアの会社でデザインがうまくいくワケ〜「エンジニア病」にはダメ出しされよう
Material Palette - Material Design Color Palette Generator
ボタン作りの手間を削減！CSSボタンデザインジェネレーターまとめ
株式会社ガイアックスの公式サイト › ガイアックスオフィシャルサイト
