株式会社raw(ロウ) | 東京のデザイン会社・映像制作会社私たちは、技術だけにとどまらず、コンセプチュアルな表現で、上質な映像を生み出します。 We create high quality videos not only with technology, also with conceptual expression. Learn Moreもっと知る
非デザイナーの僕が「デザインぽい」ことをする時に使う便利ツール17個｜苦しんでプログラミングを学んだ柴犬（くるしば）
※こちらの記事がはてブの総合人気エントリに入りました！ こんにちは。くるしばです。 元々コンサルタントの仕事をしていましたが、独学でプログラミングを学習し、Webサービスを作って起業しました。 その後個人で開発したサービスを売却したり、また別のIT系の会社を創業したりしています。 去年の8月から下記のTwitterにてプログラミング学習に関して発信し始め、ありがたいことに8000人の方々にフォローして頂きました。 プログラミング初心者に絶対覚えてほしい、ググる時の効率が10倍上がるコツ pic.twitter.com/hK1ZhNavwh — 苦しんでプログラミングを学んだ柴犬（くるしば） (@shiba_program) September 13, 2022 僕は普段はいわゆるPMやエンジニアとして仕事をすることが多いのですが、業務でも個人プロジェクトを作っている時でも 「最低限の見栄え
「信頼感や安心感のあるデザインにしました(ｷﾘｯ」←デザイナーがよくいうやつ。 - 笑顔を創りたいWebディレクターの日常
「御社の信頼感や安心感を表現するため、こういうサイトデザインにしました」 みたいなことをデザイナーもディレクターも言いがちなんですが、僕はこの表現が嫌いなんですよね。っていうかそれ何も言ってないのと同じじゃん？っていう。 デザインコンセプトを決めるときや、その説明のときに信頼感とか安心感とかいうワードは使わない方が良いとすら思う。使うにしても、もう一歩掘り下げるとか。 いや、まあ信頼感や安心感という言葉でどんなデザインを表現したいかってのは、だいたいはイメージつくので、依頼側とデザイナー側が共通言語として使えてるならべつにいいんですけどね。 今日はそんなお話。 そんなわけで、うぇぶぎょうかいのむめいでぃれくたーのお時間です。 信頼感や安心感のあるWebサイトデザインってじゃあなによ パッと思いつくのは、たとえば落ち着いた配色でキービジュアルに自社ビルの写真なんかを大きく置いたデザインとかで
クリックされるバナーを作成する際に参考になる記事8選
Web担当者の皆様、バナー広告はどのように作成されていますか？ 社内デザイナーがいる場合、外注する場合、どちらにしてもバナーのデザインはデザイナー任せになっていませんか？ バナー広告はぱっと見の印象でクリックされるかどうかが決まってしまうため、デザインや盛り込む内容は非常に重要です。 今回は、クリックされるバナー広告を作成する時に参考になる記事をまとめました。バナー広告の効果を最大化させたい方は是非チェックしてみてください。 バナー広告作成時のコツを紹介している記事 1.バナー広告の基本のレイアウトを意識する 勝てるバナーレイアウト20選！│レイアウトに悩んだ時の虎の巻 バナー広告には定番のレイアウトが複数存在します。それらをおさえておけばある程度見やすいバナー広告を作成することができます。こちらの記事では用途別のバナー広告レイアウトも紹介されています。 2.高品質なバナーをすぐに作成する
デザインのいろは｜Adobe
Creative Cloudでチラシやカード、webバナーや販促品を作る前に、まずはデザインの基本をしっかりと理解することで、より魅力的なものを作ることができます。 このページはデザインをこれから学びたいという方、デザイナーではないけど、目の引くチラシや販促物を作りたいという方、初心者っぽいデザインから抜け出せなく悩んでいる方におすすめです。人気書籍『なるほどデザイン』著者・筒井美希さんがデザイン初心者にわかりやすくまとめたデザイン入門ページとなります。 わたしが生まれて初めてアドビ製品に触れたのは、高校生のとき。デザイン専門学校の体験授業の最中でした。Macintoshがずらりと並ぶ教室にワクワクし、Photoshopでフィルターを片っ端から試して遊んでいたわたしに、教えてくれていた先輩学生がひとこと、アドバイスをくれました。 「ソフトウェアの機能はいっぱいあるけど、実際にすべてを使うわ
[WordPress]Instagramの写真をブログにも自動投稿できるプラグイン「Instagrate to WordPress」を導入してみた。
こんちくわ。 Instagramも大好きな@conchikuwaです。 気に入った写真が撮れればInstagramにアップしております。 その気に入った写真をせっかくなら自分のブログにも投稿したいなと思い、プラグイン「Instagrate to WordPress」を導入してみましたので、設定方法と使用感をレポしてみようと思います。では早速！！ Instagramは写真版Twitterって感じのソーシャルネットワークサービスです。 まぁ有名なんでご存知ですよね。 で、せっかく撮ったお気に入りの写真なので、自分のブログにもアップしてフォトログとして1つのコンテンツにしたいなと。 実は以前からiftttやPosterous等の外部サービスを使ってこのブログにも写真を投稿していたんですが、その方法だとInstagramもしくはPosterousからのリンクという形で投稿されるので、自分のサーバー
![[WordPress]Instagramの写真をブログにも自動投稿できるプラグイン「Instagrate to WordPress」を導入してみた。](https://cdn-ak-scissors.b.st-hatena.com/image/square/d69b3e57b294e8366af243e5e40626d5bf003f51/height=288;version=1;width=512/https%3A%2F%2Fwww.conchikuwa.com%2Fwordpress%2Fwp-content%2Fuploads%2Finstagram1-7.png)
スプラッシュページとは？デザイン事例まとめ – ワードプレステーマTCD
スプラッシュページ（Splash page）とは、ウェブサイトの訪問者が最初に見るページのことを指します。ウェブサイトが表示される前のイントロダクションページとして、ブランドロゴ・動画・キャンペーンフォームなどが差し込まれるのが一般的です。最近ではスプラッシュスクリーン（Splash screen）とも呼ばれています。 スプラッシュページは、Flashの全盛期によく使われていました。当時はWEB制作者の技術やセンスを見せる目的で使われていたことが多かった気がします。 近年ではブランドイメージを直感的に印象付けるため、期待感を抱かせるため、といった実用的な目的で採用されます。 スプラッシュページ（スプラッシュスクリーン）の用途： ブランドイメージの表現 年齢確認 言語選択 キャンペーン告知 そのためここでは、見る人のインスピレーションをインスピレーションを掻き立てる！そんな美しくてかっこいい
実務経験3年すぎた現役Webデザイナーのリアル【勉強方法編】 - IT系女子ログ
（7月25日、コーディング編更新しました。） 私がWebのスキルアップのために行っている勉強方法をすべてご紹介します。 たくさんありますが、「今日は模写をしてみよう」とか、「今日は案出ししてみよう」とか、楽しんで勉強するのが一番だと思います。 今まで自分に合っているものを優先して取り入れてきましたが、「もっと効率いい方法があるよ！」というアイデアがあれば、ぜひ教えていただきたいです！ デザイン編 忙しくてもできること 毎日5分でもデザインを観察する ニュースを見る、読む いいと感じたデザインを自分なりに消化してから制作に取り入れる 部分的でもいいので2案以上作る 周りの人に自分から意見をいただきにいく 意見をいただいたら要点を控えておく 提出する時には自分の言葉での説明も添える 広告を見て、伝えたい内容や狙いを考察する 時間あるときにしたいこと 思い浮かんだ案をできるだけ作ってみる 素敵だ
CSS書きたくなさすぎ問題2017 - DRYな備忘録
css書きたくない。できればjsも書きたくない。js必要なの嫌。軽くやりたい。という個人の日記です。 参考 Best CSS Frameworks of 2017 | Three29 10 Free Lightweight CSS Frameworks for a Fast Start 2017年にチェックしておきたい、CSSの軽量フレームワークのまとめ | コリス ググれ。 lightweight css framework - Google 検索 Gridだけやりたいやつは除外した。 Bootstrap Materialize mui （追記）UIkit （追記）Semantic UI Pure Bulma Skelton Spectre.css Kube Vuetify Fictoan avalanche Beuter Vanilla Milligram InvisCSS Look
ブックマークしておきたい海外/国内Webデザインギャラリーまとめ30選【2017年改訂版】
Webサイトのデザインがなかなか決まらない。 そんなときは、他のデザイナーが作成したWebデザインをまとめた、ギャラリーサイトをチェックしてみてはいかがでしょう。レイアウトや配色など、アイデアが湧いてくることがあります。 今回は、ウェブサイト制作の参考になりそうなアイデア、インスピレーションを与えてくれるWebデザインギャラリーサイトをまとめています。リストを一度見直し、2017年現在も更新を続けているサイトのみ厳選、追加しているので、実践的でクリエイティブなデザインを探すことができるでしょう。 詳細は以下から。 デザイン制作の参考にしたい、Webギャラリーサイトまとめ 厳選 国内ギャラリーサイトまとめ Muuuuu.org クオリティが高い縦に長いサイトを厳選して集めているサイトです。 現代デザイン トップページだけでなく中面、下層ページもまとめて表示され便利です。 81-web 当サイ
15万記事を分析してわかった、クリック率を20％高める「記事タイトル」3つの法則とは？｜アプリマーケティング研究所
Outbrainという会社の「WEBコンテンツの見出し（タイトル）」について、15万記事を調査したデータが、おもしろかったので簡単にメモ。 １）8ワードのタイトルがクリック率が最高に。 記事タイトルの長さとしては、8ワード（英語で）のものが一番クリック率が高かった。平均よりも21％高かった。 ２）サムネイル画像を入れるとクリック率＋27％ ほとんどのメディアはやっている気がするが、サムネイル画像を記事タイトルに加えると、クリック率を27％も高めることができる。 たぶん、ソーシャルのOGP画像とかもそうだし、あとはスマートニュースとかにも、多かれ少なかれ、当てはまる話だと思われる。 ３）偶数よりも奇数のほうが20％も吸引力がある 偶数よりも奇数のほうがクリック率が20％も高まる。たとえば「デザイン上達8のコツ」よりも「デザイン上達7のコツ」にすべきだと。 感覚的には「3・5・7」あたりの数値
簡単！レスポンシブデザインでYoutubeやGoogle Mapsを埋め込む便利なツール | WordPressやWebデザインなど紹介 Ocadweb
レスポンシブのツールを以前紹介していますが、Webサイトでもレスポンシブが当たり前になってきています。 PCでスマホ、タブレット表示を確認しよう！レスポンシブチェックツール ただサイト元はレスポンシブ表示したけど、Youtubeなどの動画やGoogle Mapsをサイトに埋め込んだもののレスポンシブ表示されず、埋め込み部分だけ大きく表示されて半分しか表示されていないってことありませんか。 WordPressのテーマ（テンプレート）によっては普通に埋め込んだものもレスポンシブ対応してくれるものもありますが、レスポンシブ表示されない場合にはこちらを使ってみてはいかがでしょうか。 今回はYoutubeやGoogle Mapsなどの埋め込みをレスポンシブ表示できるサービス「Embed Responsively」を紹介します。 但し、2016年6月22日以降に制作した新規サイトでGoogle Map
ノンデザイナーがもっと知りたい！センスより大切なデザイン心理学のルール＋3つ
「購入ボタンは緑色がいいって専門家が言っている」「いや、Amazonのオレンジだ」なんて不毛な議論をしていませんか？ ディレクターやエンジニアにも役立つ、Webデザインで使える心理学のルールを3つ紹介します。 『ノンデザイナーこそ知っておきたい！デザインでセンスより大切な心理学のルール』では、Webサイトの成果を大幅に改善してくれる4つの有名な心理学ルールについて説明しました。今回は、色や人間の注意力持続時間、反応を研究したさらに3つの心理学ルールを紹介します。そして、ルールに沿ってWebサイトを改善し、より大きな成功を得る方法について説明します。 では、始めます。 ルール1：人間が注意力を持続できる時間は、毎年短くなっている 2015年、Microsoftは2000人の被験者を対象とする調査を実行し（調査結果PDF）、脳波記録装置を使って112人以上の人びとの脳活用をモニタリングしました
これ知ってる？WEBの人なら押さえておきたいツール＆サービス50選 - 死ぬまでWEB屋
公開前に知人に見せたら、読むのに20分もかかったわ！！ と、お叱りを受けましたｗ オススメのツールやWEBサービスということで50ほど紹介していますが、僕の使用感のほかに、ところどころ経験談的なものが入っています。そのあたり、読むのがめんどうな方は読み飛ばしていただければ幸いです。 2万文字近くあるので、お時間ある際にゆるりと読んでいただければと思います。 それではお楽しみ下さい！ サイト解析に使えるツール・サービス import.io Juicer Ptengine GTmetrix CLOUD FLARE wayback timemachine シミラーウェブ Open Site Explorer サクラサクLABO aguse Built with ディレクションに使えるツール・サービス ウェブチェッカー Cat Mdes maindmaister ひとりブレスト 関連キーワード取得
初心者必見！Webデザインを独学で勉強するときにおすすめな記事10選
WebデザインはPCとネット環境さえあれば始めることができるので、独学でとりあえずやってみる、という方も多いのではないでしょうか。 この記事では、Webデザイナー初心者の方向けにデザインの基礎を学べるサイトを紹介します。理論的に学べる記事や実例が豊富な記事、テクニックも取り上げている記事など、どれも参考になるおすすめ記事を10個厳選しています。 １. デザインを勉強したことがない人でもデザインできるようになるかもしれない４つの基本原則 「ノンデザイナーズ・デザインブック」のデザインの原則を基礎として、Webデザインではどう考えればよいのか？ という点を分かりやすく解説してあります。Web Design RECIPESのNoriさんの文章は硬すぎず、すっと頭に入ってきてとても分かりやすいです。 ２. デザインの基礎力をワンランクアップしたい私（Webデザイナー）の注意書き １で紹介した記
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ウェブデザインB 第02回 - ウェブデザインB | WordPress・jQuery・HTML・CSSのスニペット集 WEBCRE8TOR.COM
デザイン原則の実践｜dely design
CSSのflexbox(display:flex;)を使った縦並び、横並びレイアウトの基礎知識｜Gimmick log
I/O 3000
I LADY. 〜Do You Lady？〜
