ホーム WEB制作

WEB制作

ECサイトをおしゃれに改造!カンタンに使える手書き風フォント10選!

ECサイトを運営していると、デザインと常に隣り合わせですよね。 商品写真を加工したり、イベントがあればそれ用のバナーなどを作ったり、作るものが山ほどあります。 そんな時、クオリティの高い写真やイラストなどの他に、「フォント」が必要となってきます。 使っている画像加工ソフトに最初から入っているフォントだけでは限界があります。 かわいらしさやかっこよさなど、自分が目指すデザインを作るためには色んなフォントが必要不可欠です。 ということで今回は、かわいい系や癒し系を作りたい人に必見!手書き風フォントを10選ご紹介していきます! ※無料で商用利用OKのものを厳選してご紹介していますが、DLして使用する前にまずはご自身でもライセンス関連の方のチェックして把握しておくようにしておきましょう。 あんずもじ あんずもじ オーソドックスですが、優しい雰囲気の漂うかわいらしい和文フォントです! 文字が他と比べると少し小さめなので、繊細で女の子っぽい感じもしますね。 画像にもある通り、縦書きにしても不具合などでないので、使い勝手が良いフォントだと思います。 ただ絵文字は、「けいせん」を変換して出てくる記号の中のどれかが上記の画像みたいな絵文字になるので、ちょっと探すの大変です・・・ ふい字 ふい字 サインペンで書いたような手書き感のあるフォントです。 結構難しめの漢字も変換できちゃうようなので使い勝手がよさそうですね! 上記の画像の背景画像になっているものが、おそらく登録されている絵文字だとおもうのですが、これも「けいせん」で変換した時に出る記号の一部なので使用したい方は探してみてくださいー! うずらフォント うずらフォント こちらも小さめですが、丸っこさもありカクカクっぽさもある、かわいらしい手書き風フォントです。 小さいけど若干太めなのでわりと読みやすいですね!結構色んなところで使われている人気のフォントみたいですよ! 上記には載せていませんが、漢字や縦書き対応もしていて、英語もかわいいので色んな場面で使えちゃいますね。 こども丸ゴシック細め こども丸ゴシック細め これぞTHE MARUMOJIと言いたくなるほどの丸文字でゴシック調のフォントですね! 小学生の時こういう字書く子いたなぁとちょっと懐かしく感じました、個人的に。 ただ漢字は上記の通り小3レベルなので、変換できない漢字の方が多いかもしれませんね。 ほそくなーい?太いの欲しいんだけどって方は、太めに作られた「こども丸ゴシック」というものも同じサイトで提供しているのでそちらもチェックしてみてください! kawaii手書き文字 kawaii手書き文字 ちょっぴりギャルっぽさがある、女の子女の子したKawaii手書きフォントです。 漢字は教育漢字・常用漢字を中心に約1,930字ほど入っているそうなので、一部変換できない漢字もあり そうですが、随時追加予定とのことなので要チェックです!クセがあるものの読みにくくさはなく、LINEスタンプとかに使われてそうな親しみやすい感じもします。 えり字 えり字 使いづらい・・・とのっけから自虐的ですが、女子高生っぽい若々しい感じのするフォントですね! クセが結構強い分、このフォント独特の雰囲気が全面に出るので、うまく使えばおもしろいんじゃないかなぁと思います。 こちらも漢字は随時更新予定だそう。サンプルを見る限り難しい漢字も入ってそうですが、どうでしょう。すぐ使わないかもしれないけど、女子が好きそうなので持っておきたいフォントかもです! りいてがきN りいてがきN こちらは丸っこさがある、手書きっていったらまずこれだよねって感じのする手書きフォントです。 個人的には英文字や数字がすごくナチュラルで結構好きです。 絵文字付きなのですが、サイトに絵文字表?なるものが載っているので、どの記号がどれかわかるようになっています。親切! 絵文字の感じとか文字のやさしい雰囲気とかで、なんとなく保育士さんが使いそうなフォントだなぁと思いました。 ホリデイ Holiday-MDJP05 こちらのフォントはよくバージョンアップされているようで、絵文字や記号などの統一感もあり完成度が高めだと思います。ロゴなどで繰り返し使う場合は有料になってしまうので、要注意です! 良い意味で少し崩れた丸文字が、POPな雰囲気も出してくれていますね。 こちらのサイトでは他にも多くのフォントを取り扱っていて、本も出版されているようなので、そちらもぜひチェックです! たぬき油性マジック たぬき油性マジック 油性極太マジックで書いたようなこちらの手書きフォント、手書きのチラシとかでよくこんな感じの目にしますよね!ポップなんかにも使えるかもしれません。 サイトの方にはチラシサンプルや年賀状サンプルが載っているので見てみてください! 今までかわいい系ばかりでしたが、これは力強さのあるフォントなのでまた違ったものが作れちゃいます。 じゆうちょうフォント じゆうちょうフォント こちらは極太丸文字手書きフォントで、極太な分より力強さが出ますね! ただ丸文字なのでどこか温かさというかやさしさも感じるフォントになってます。 漢字は6900字以上と豊富なので、不自由なく使えそうですね。 さきほどのフォントと同様、チラシやポップにもマッチしそうですね! 最後に ECサイトで使えそうな手書き風フォントを10選ご紹介しました。 どれも個性的で持っておけば色んな場面で使えそうですね! 最後に余談ですが、人の名前みたいなフォント名を見ると、自分の手書き文字だから自分の名前つけてるのかなぁとか思ってしまいます。 以上!みっしぇるでした!

新人デザイナーに教えたい!絶対に買っておくべきWebデザイン書籍5選!

こんにちは、花粉症でひたすらくしゃみし続ける相馬です。 このままだと全身の水分がなくなるんじゃないか?と思うほどです。 さてさて、僕は現在、フリーのデザイナーとして生活しています。 誰でもそうですが、新人時代というものがありますよね。僕も5年ほど前にある会社にWebデザイナーとして就職したんですが、その時はほんとに右も左も上も下も、前も後ろも斜めすら分からずに必死の毎日でした。 今回はそんな5年前の僕のように、この春からデザイナーになった方や、これから目指す方、まだ新人という自覚がある方、それぞれのデザイナーさんにぜひオススメしたい書籍をご紹介します。 余談ですがこういう"新人向け"の本って、今読んでも全然勉強になります。 基礎ってやっぱり忘れがちだし、読むことで初心に帰ることもできるし、まだまだやなあ、と思うことばっかり。一生勉強ですねー。 現在ベテランの域に達している方も読んでみても良いかもしれません。 新人デザイナーに読んで欲しいWebデザイン書籍 現場のプロが教えるWebデザイン&レイアウトの最新常識 現場のプロが教えるWebデザイン&レイアウトの最新常識 テクニックや技術本というよりも、Webデザインの基本的なレイアウトを実例を交えて、何故このレイアウトになったのか、その過程と理由がしっかりと分かる本です。 現在重要視されるUI視点での考え方がトレンドな感じですが、いつの時代も変わらない根本的な部分をしっかりと理解できると思います。制作している中でふと思い出す。そんなことが沢山書いてある書籍ではないでしょうか。 タイポグラフィの基本ルール タイポグラフィの基本ルール これ、周りにも結構読んでる人が多いし、有名な書籍ですが、ひとまず抑えておきたいもののひとつ。 会社に勤めていた時に感じていたんですが、どんな優秀な新人さんでも文字組が上手くいってないパターンって結構多いんですよね。 この本には"なんとなく"で文字を組んでいた新人時代の僕をめちゃくちゃ助けてもらいました。 ロゴの作成はもちろん、文字を使うデザインはWebデザインであろうと大切です。 神速Photoshop 神速Photoshop Photoshopを独学で学んだ場合に多いのが、ひとつのやり方しか知らない、というパターン。 どうしても爆速で終わらさなければならない仕事は現場では山程あります。そんな時に、作業時間を減らしてクリエイティブな時間に充てられれば、デザインそのものを考える時間を増やすことが出来ます。 目からウロコのテクニックが満載です。マイデスクの棚には必ず置いておきたい一冊。 Webデザインの新しい教科書 Webデザインの新しい教科書 Webとはなんなのか、ということをしっかりと深く掘り下げて解説してくれます。 就職の為にとにかくテクニックを身につけてきた新人デザイナーにはぴったりな本。自分で身につけたテクニックをもう一段階上のレベルに上げてくれます。 改訂新版が出たので、また買おうか悩んでいます。 プロとして恥ずかしくない 新・WEBデザインの大原則 プロとして恥ずかしくない 新・WEBデザインの大原則 レイアウトや配色からサイト公開後の運用まで、すべての基礎を現場レベルで学べる本です。 図が分かりやすく、Webについて見つけた基礎をよりしっかりと自分に落としこむのに最適。 会社に入るまでに身につけた知識やテクニックを、どうやって現場に活かしていくかを考えるとき、この本が役に立つと思います。 まとめ:書籍だけでなく、能動的にWebデザインを身につける 以上、新人デザイナーにオススメのWebデザインに関する書籍を5冊ピックアップしました。 僕が会社にいた時に、後で入ってくる後輩たちには、テクニックは高いレベルで身に着けていても、それを生かし切れない「もったいなさ」を感じる子がとても多かったのを覚えています。 せっかく身につけたものは最大限活かして、Webデザイナーとして活躍したいですよね。 そのためには、仕事をこなす中でも能動的に知識やテクニック、見つけていく必要があります。 基礎は変わらなくても、デザインというものは日々進化していくもの。進化していく過程で、基礎がスカスカだと、どこかでポキっと折れちゃいます。 基盤をしっかり作れる時間は、新人の時が一番あります。 その間にしっかりと太い基礎を作っておきましょう。 ではでは。

サイト運営者なら知っておきたい!カンタン画像加工サービス7選!

色々ダウンロードしすぎてパソコンを壊したことがあるみっしぇるです。こんにちは! 「ダウンロード」するということを覚えたてで楽しくなっちゃったんでしょうね。なんでもかんでもダウンロードするもんじゃありません。 私みたいな過ちを犯す人はそうそういないかと思いますが、仕事する上でダウンロードしなければいけないものって結構あったりしますよね。サイト運営者なら、サイトに使用する画像やその画像を加工するためのソフトなど。 やはりPhotoshopがメジャーですが、しょっちゅう使ったりすることがなければ正直もっと簡易的なものでもいいかなぁと思うこともあるかと思います。 でもかっこいい画像は作りたいので、無料でダウンロードする必要がなくて簡単に加工ができちゃう画像加工サービスが理想となってきます。 そんなのないか・・・と諦め気味なあなたのために! 今回は簡単に編集できちゃう、サイト運営者必見の簡単画像加工サービスを7選ご紹介いたします! Polarr Polarr ブラウザ上で利用可能な白くまさんが印象的なこちらの画像加工ソフトは、加工フィルタがあるのでそれを使っちゃえばそれで完成です。まだまだこだわるぜ!という方は右サイドにトーンカーブやレンズ補正など細かい設定も可能なので結構自由に加工できちゃいます。 ちなみにChrome拡張機能版もあります。こちらは有料アップグレードもできちゃいます。 fotor fotor 画像加工だけでなく、おしゃれなコラージュやSNS向けのカバー画像制作、HDR、更に美顔加工までできてしまう、他と比べたらちょっぴりお得感のする画像加工サービスです。上記の画像の左下にもある通り、モバイル版もあるようなので試してみてもいいかなと思います。 更にこちらもアップグレードが可能なようで、フォトグラファー・デザイナー・プロフェッショナルの3プラン用意されており、それぞれ機能がたくさんプラスされていますので、気になったらぜひチェックしてみてください。 Picozu Picozu HTML5とCSS3をベースに作られたシンプルなデザインのこちらの画像加工サービスは、レイヤーもあるので結構複雑な加工もできちゃいそうですね。レイヤーがなくなっちゃうこともなくPSDファイルを開くことができるようなので便利ですね! あと編集画面の右下に豆知識的なものが時々表示されるので、なだ慣れてないうちは嬉しい機能だと思います。また、こちらもChrome拡張機能が用意されています。 befunky befunky ビーファンキーという名前に恥じないほどの様々な機能が詰まった画像加工サービスです。美顔加工やコラージュ、グラフィックデザインもできちゃいます。 ただフィルタやフレームなどの機能を見てみると、一部有料のものもあるので、気に入った!全部使いたい!という方はアップグレードをおすすめします。更にモバイル版もあるようなのでぜひチェックしてみてください! Pixlr Express Pixlr Express 公式サイト Pixlrシリーズ第一弾です。このシリーズの中では一番人気を誇るこちらのツールは、フィルターやフォント、スタンプなどが豊富に用意されており、簡単に画像加工ができちゃいます。 個人的に使用してみて感じたのは、「簡単にサクッと加工」を重点的に意識して作られているようで、イメージとしてはスマホで使用するような画像加工アプリのような感覚がしました。 Pixlr Editor Pixlr Editor 公式サイト Pixlrシリーズ第二弾!Expressに比べてより精密で細かい加工ができるように作られたこちらのツールは、Photoshop並みの機能を求められている方におすすめです。上記の画像を見てもらうとわかるともいますが、形がもうPhotoshopっぽいですよね。 広告が邪魔ですが、機能も充実していて複雑な加工もできちゃいそうです。公式サイトは英語ですが、ツール内はちゃんと日本語で表示されるので安心です。 Pixlr O-Matic Pixlr O-Matic 公式サイト Pixlr第三弾です!上記の画像を見て、あ!と思う人もいらっしゃるかと思います。実は私もこのホーム画面見たとき思いました。実はこちらのツールは、スマホアプリとしても人気の画像加工ツールなのです。イメージとしてはアプリがブラウザ上でも使えるようになっちゃった!という感じです。 なので簡単に加工出来ちゃいますし、レトロ調のエフェクトが多くあるのでヴィンテージ感を出したい場合におすすめです。ちなみにPixlrのChrome拡張機能版はこちら! 最後に 簡単にできちゃう画像加工サービスを7つご紹介してきましたが、いかがでしたか? ダウンロードするまでもないけど、ある程度のかっこいい画像は作りたい、でもPhotoshopとまではいかない・・・という人にはどれもきっと魅力的だったと思います。 あとは自身がよく利用するであろう機能やフィルタなど加工手段の種類の豊富さなど、そして使い勝手の良さで自分にあったサービスを見つけてください! ではではこの辺で、みっしぇるでした!

ネットショップの背景に使いたい!背景フリー素材7選!

朝から隣の家の猫が塀から顔を出していたので、じっとにらめっこをしていました。 みっしぇるです、こんにちは!猫は癒されますね・・・ ネットショップなどのWEBサイトやブログを制作する時、背景画像に悩んだ経験はありませんか? 「全体デザインはできているけど、なんか足りない気がするからもうちょっとどうにかしたい」 「こんなデザインがいいんだけど探すの大変そう」 「作りたいけど作り方わからないし参考にできるものがほしい」 「ここのこの部分に使いたいんだけど何がいいか全然わからない!」 などなど、シチュエーションは様々ですよね! そんな時、いつでも必要な時にパっと開けるサイトを知っておくととっても便利です。 ということで今回は、商用利用可・フリーな背景素材がある素材サイトを7選!ご紹介していきたいと思いますー! ちゃんと厳選してご紹介しますが、ライセンス関連などはご自身でもしっかりチェックしてから素材は利用してくださいね! ではさっそく見ていきましょう。 Bg-Patterns Bg-Patterns 自分だけの背景画像がほしい!というこだわりが強めの方にはおすすめの素材サイトさんです! もちろんそのままダウンロードすることもできますが、知識がなくてもブラウザ上で配色や大きさ、テクスチャなどのカスタマイズができちゃいます。 何を隠そう私はこのTOPECONHEROESさんが運営する素材サイトシリーズが大好きで、背景画像に限らず他の素材サイトさんもよく利用しております。 ヘッダー部分に書くサイトに飛べるリンクがあるので、気になったらぜひそちらも利用してみてください! DBF DBF 一般的に言う背景画像とは違って、こちらのサイトではぼかしやポリゴン系の背景画像が多くみられます。 スタイリッシュやキレイめを目指してたり、シンプルでしゅっとした感じがいいなって人はこういった背景画像がマッチするかもしれませんね!他にもテクスチャ系やピクセルパターンなどもいくつかあるようです。 Subtle Patterns Subtle Patterns このサイトでは、基本的にシンプルで細かめのとても繊細なイメージを受ける背景画像が多く揃っています。 淡い色のものばかりなので、おそらくお持ちのサイトと喧嘩してしまうことはあまりないかと思います。 カテゴリはないですが、検索機能がついていて、フッター部分にはよく利用されるタグもあるので簡単に探せちゃいますね。 有料ですが運営者がプラグインを開発されたようで、400種類もの背景画像を利用することができます。 Best PSD Freebies Best PSD Freebies 背景画像だけでなく、アイコンなどのWEBパーツを紹介しているこちらの素材サイト。 個性的なものが多くみられるので、ちょっと一味違う背景画像をお探しならこちらも要チェックです! Zooll.com Zooll.com こちらのサイトはどちらかというとブログみたいな感じで、素材を紹介しています。 比較的「GOODIES」で多くPOPでアメリカチックなユニークな背景画像を紹介しているのですが、「LOOK WHAT I FOUND」は運営者が見つけてきたテクスチャや画像など様々なWEB素材が紹介されています。 「TIMELINE COVERS」ではFacebookに使えるカバー素材、「WALLPAPERS」ではデスクトップやスマホ用壁紙、「PRINTABLES」ではプリントアウトが可能で商用利用可能なパターンが見られます。 基本GOODIESを見ていれば背景画像を見つけれられると思うのですが、良い素材を多く紹介しているので、他のページのぜひ随時チェックしてみてほしいなと思うサイトです! textures.com textures.com 会員登録が必要な上一日にダウンロードできるのは15回までという制限付きですが、とにかく種類が豊富でクオリティ高めなテクスチャ素材サイトです。 更にテクスチャと言ってはいますが、見てみると画像素材もあります。 封筒や木や葉っぱなど、中には透過画像もあるので背景画像目的でなくても利用できそうです。 フリーテクスチャ素材館 フリーテクスチャ素材館 こちらもテクスチャーサイトで、カテゴリ・タグ分けされているので探しやすくなっています。 紹介されている素材も、ちゃんとシームレスになっていてサイトだけでなく素材の使い勝手もいいかと思います。 最後に さて、背景画像サイトを7つご紹介してきましたいかがでしたでしょうか? ダウンロードしたものをそのまま使うもよし、自分好みに加工して使用するのもよし、テクスチャを使って雰囲気のある背景画像を作るのもよしです。 今回ご紹介したサイト使って、自身のサイトにあった背景画像を見つけてもらえたらと思います! ではではこのへんで。みっしぇるでした!

ネットショップの装飾に!無料で可愛いイラスト素材サイト7選!

防犯のために窓に付けたセキュリティグッズが、急にピピっとかいうので日々怯えているみっしぇるです。窓に衝撃が加えられたときに警告音が鳴るものなのに、これじゃ安心できない・・・ 今回はネットショップやWEBサイトを運営していく上で非常に役に立つかわいいイラスト素材サイトを7選をご紹介したいと思います! イラストと一言にいっても種類は様々ですし、使用方法もまた様々ですよね。 サイトのデザインによっても使用するものが変わってくると思うので、毎回希望のイラストを探し出すのに一苦労ですよね。 素材サイトをご紹介するときは毎回言っているような気がするのですが、やはり一度いいなぁと思ったサイトは即お気に入りに登録しておくと便利です。 例え、その時しか使わないような系統のものだったとしても、また次使いたい時が来たとき一から探すのは骨が折れるので、いつでもアクセスできるようにしておきましょう。 それではさっそく、素材サイトを見ていきましょう! ※商用利用可でフリーな素材サイトを厳選してご紹介していますが、念のためご自身でもライセンス関係などチェックしておくことをおすすめします。 いらすとや いらすとや やはりイラストといえばまずはこちらの素材サイトですよね!もうすでにご存知という方は多くいらっしゃると思います。 人物から建物や植物など、種類は豊富でしかもすべてかわいらしくてほっこりするようなものばかり! 使い勝手が非常にいいので、私は困ったらよくこちらのサイトに来ます。 ガーリー素材 ガーリー素材 女性向けのかわいいイラストがたくさん揃っている素材サイトです。 メルヘンなものやキレイな女の子のイラストがあって、雑貨屋さんや美容系のサイトにいいかもしれませんね! 素材集もたくさん出版されているようなので、そちらもぜひチェックしてみてください! 植物がリアルだけど女性らしさもあって、サイトに使ったらいい雰囲気が出せそうです。 イラストレイン イラストレイン サイト名からも連想できる通り、こちらの素材サイトでは子供向けのかわいらしいイラストが多めです。 基本手書きタッチなのでほっこり感もありますし、季節やイベントものが豊富なので子供向け商品を取り扱うネットショップで使えると思います。 と思いきや災害や環境問題向けの素材もあるようなので、イメージ的には小学校でよくもらっていたお便りに載せるようなイラストかなぁと思います。 無料イラストのIMT 無料イラストのIMT 様々なテイストのイラストが揃っているこちらのサイト、女性っぽいものが多めな感じもしますが、カテゴリも豊富にあるのでお探しのイラストも見つけやすいかもしれません。 無料でイラストリクエストも受け付けているようなので、このテイストは好きだけどこんな感じのイラストがない・・・なんて時に利用してみたらいかがでしょうか? ご利用前に会員登録を忘れずに! ピクト缶 ピクト缶 お目目がくりくりっとした人物イラストが特徴のかわいらしいイラスト素材屋さんです。 色鮮やかでPOPな印象を与えるので、明るい配色のサイトなんかにはよく合うのではないでしょうか! 植物や果物、野菜のイラストもかわいいので、ワンポイントに使ってもそれだけ明るくなってかわいいなと思います。 ほらぱれっと ほらぱれっと ビジネスや医療関係などを取り扱う場合取っつきやすいイラストを求めると思うのですが、かわいすぎると逆にイメージが違ってくるっていう場合ありますよね!そんな時はこちらのサイトがおすすめです。 ほどよくかわいらしい感じのイラストなので、むしろカッチリしたサイトデザインといいバランスになって、親しみやすいサイトに感じると思います。 テイストや種類が豊富なので、一度見てみてください! 人物イラスト館 人物イラスト館 こちらは人物イラストをメインに取り扱っている素材サイトさんです。 POPでちょっぴりコミカルな感じもするイラストテイストで、種類もとても豊富です! 完成度も高いので、何不自由なくいろんな場面で使えちゃいそうですね! 最後に 以上!かわいいイラスト素材サイト7選でした! 今は使う機会がなくてもお気に入りに入れておけば使用する場面にそのうち遭遇するかもしれません。 どれもかわいくて完成度も高いですし、ストックしておくときっとどこかで役に立つと思うので、ぜひ気に入ったサイトがあれば利用してみてください。 では今回はこのへんで!

ECサイトで使いたい!Webデザインのパーツを集めたまとめサイト7選!

サイトのデザインをする時にあらかじめこんなのがいい!という明確なビジョンがある場合は、作業がサクサク進んでストレスフリーですが、実際は悩んじゃったりして作業が難航しちゃうことってありますよね。 他にも希望があってもそれを形にできないとか、この部分のアイデアが中々浮かばないなんてことも。 私の経験では、サイト全体はサクサクデザインが進んで、あともうちょっとで完成だ!っていう時にある一部分で詰まってしまう・・・なんてことがよくありました・・・。さっきまで順調だったのに!というショックからか集中力もプッツリ切れちゃって更に手が止まっちゃったりしてましたね。 だいたい皆さんはそんな時には色んなサイトを見たりすると思いますが、私のような状況だったら、部分だけ見たいなっていう時もありますよね。 そんな時ぜひチェックしたい、パーツのデザインを集めた7つのまとめサイトを今回はご紹介したいと思います! ギャラリー形式になっているのでどれも見やすくて、更に勉強にもなるので一つくらいお気に入りに入れておくといいと思います。 ではさっそく見ていきましょう! Croppy Croppy こちらのサイトはパーツ別にカテゴリ分けされているのでとても見やすくなっています。 企業ロゴも見れちゃうので、ロゴで悩んだ時なんかも使えちゃいますね! 更に見たいパーツをクリックすると、使用されている色が紹介されていたりするので参考にしやすいかなと思います。 PatternTap PatternTap こちらはデザインパーツに限らず、色での絞込やデバイスでの絞込など、とにかく絞込が幅広くできるのが特徴です。 パーツをみるのであれば、TypeやStyleから設定するといいかもしれません。 表示されるキーワードは選択したら選択するだけどんどん絞り込まれていきます。 登録されているサイトがどれも今風っぽいかっこいいサイトばかりなので、今どきのデザインができて勉強にもなりますねー! UI Cloud UI Cloud サクッと検索するもよし、ただし英語なのでヘッダー部分の「CATEGORIES」ボタンからカテゴリを選ぶ方が簡単かもしれません! カテゴリ自体は豊富ですし、色やOS、CSSやjQueryなどもあるので色んなデザインが揃っています。 中には時代最先端を意識したようなユニークで他にないデザインなんかも見られます! 他と違うデザインで刺激を受けたい時などにも使えそうですね! CSSbake CSSbake POPなこちらのサイトでは、ギャラリーがかわいらしくデザインされていますね。 できることは他のサイトとほぼ同じですが、404ページのカテゴリも用意されています。 登録サイトは基本海外のものなので、海外の凝ったデザインを見ることができます! Retrobanner Retrobanner バナーって難しいですよね!小さい範囲の中で画像・文字を使用して興味をそそられるものを作らなければいけません・・・ 試行錯誤を重ねてみるも、中々良い形が思いつかない・・・という時はこちらのサイトを見て他のバナーを参考にしましょう! サイズ・縦向き横向き・色・業種などが選べますし、登録バナーもとても豊富なのできっとあなたが目指しているバナーのお手本が見つかるはずです。 バナーデザインに行き詰まったら、ここをチェックしてみてください! フッターデザイン.com フッターデザイン.com 近頃ではフッターを凝ったデザインにするサイトがとても多いですよね。 実際に自分もやってみたい!と思ったら、まずこちらのサイトで参考フッター探しをすると良いと思います! 国内サイトを集めているので、参考にしやすいのではないでしょうか。 更に「イラスト」や「カラムメニュー」、「ページトップへ戻る」などカテゴリ分けもされているので絞ってみることもできます。 HEADER LOVE HEADER LOVE こちらはヘッダー部分のみを集めた海外のサイトです。 海外ものなので、海外のかっこいいサイトが見れちゃいます。 数は少ないですが、一つ一つが大きく載っているのでサイトに飛ばなくてもしっかりデザインが見れてしまいます。 そしてこちらのサイトはヘッダー専門ですが、フッターバージョンもあるようで、その名も「FOOTER LOVE」といいます。 フッターが気になったらこちらもぜひチェックしてみてください! さいごに 以上!7つのデザインパーツまとめサイトをご紹介してきましたがどうでしたか? 国内サイトや海外サイトの部分デザインを見ていっぱい刺激をもらっちゃいましょう! あーでもないこーでもないと一人でぐるぐる考えてしまっていると、逆に嫌になってきてしまうので要注意です。 あ、詰まった!と感じたら休憩するなり今回ご紹介させてもらったサイトを参考にするなりして、リセットするのがいいと思います! ということで今回はここまでです! みっしぇるでした。

Webデザインを始めたい人必見!今すぐブクマしたい良質ブログ7選!

こんにちは、スポーツ大好きの相馬です。 春が近づいてくると野球やサッカー、ゴルフなどの国内プロスポーツが始まってきてワクワクしますね。冬は何もないのがつまらんです。ちなみに運動は全くしません。見る専門です、ハイ。 いきなりですが、このブログを見ている方の中には、WebデザイナーではないけどECサイトの運営担当者さんが結構いると思います。そんな方の中には、実際にWebに触れてみて、Webデザイナーになりたいなあ・・・なんて思うこともあるんじゃないでしょうか?ありますよね? そんな方のためにも、今回はブクマ絶対推奨のWebデザインが学べるブログを集めました。 ボク自身もデザイナーになる前に参考にさせてもらったサイトや、今でも毎日チェックするサイトなど、とってもとっても為にブログばかりです。Webデザインをやりたくなくても、これらのブログを見たらWebデザインがしたくてたまらなくなりますよ。 Webデザインが学べる良質なブログ7選 コリス コリス Webデザインを中心に、PhotoshopやIllustratorなど、Web周りのツールに関するウレシイ記事を量産している超有名サイト。 海外の記事の翻訳や、色んな時短方法など、現場よりの実践的な記事も多く、新米デザイナーもベテランデザイナーも学べるサイトです。 Basic Design Note Basic Design Note 「"デザインの基本"を学び直すブログ」というコンセプトの通り、図を載せながら分かりやすく、丁寧に解説してくれるブログ。 更新が滞ってはいますが、デザインの基礎とは何年たっても変わらないもの。 新人さんや初心者さんはもちろん、基本を忘れがちなベテランだからこそ読まなければいけないブログかもしれません。 何事も基本が一番大事ですよね。 ホームページを作る人のネタ帳 ホームページを作る人のネタ帳 普通のデザインとは違う、人を集めることができるサイトをつくるための「Webデザイン」が学べるサイトです。 Webデザインの専門記事にあふれていますが、たまに投稿される雑記も学ぶべきことが多い良質な記事です。こちらも現場レベルだからこそのあるあるに溢れた記事が満載。Web制作における苦労面を知ることができるのもポイントです。 Webクリエイターボックス Webクリエイターボックス こちらもWebを学んだ方なら一度は目にしたことがあるであろうブログサイト。 図解入りで読みやすい文体が特徴で、初心者にも分かりやすく、Webの楽しさ、面白さを感じることができる記事ばかり。 些細なことを詳しく丁寧に解説する記事が多い印象。オススメです。 株式会社LIG 株式会社LIG Web業界では超有名企業のブログ。自社メディアの先駆け的存在です。 真面目にフザケたお笑い系の記事が話題に上りがちですが、技術記事は社内スタッフの技術の高さが伺える内容のものが多く、とても参考になります。 ライブラリでジャンルがまとめられているのも読む側としてはありがたいですね。 DesignDevelop DesignDevelop 無料素材やデザインに関する情報とともに、技術的なハウツー記事も豊富なブログ。 更新頻度も高く、短い時間でサラッと情報を取り入れられる程よい長さの記事で、毎日チェックするサイトのひとつに入れても良いかもしれません。 keisuke.tsukayoshi keisuke.tsukayoshi レイアウトも美しいブログ。 デザインももちろん、UIに関する質の高い記事が多く、アプリのデザインなどの参考にもなります。 デザインが美しいと、記事にも説得力がありますね。 まとめ:参考になるブログは、やっぱりデザインも優れている 以上、Webデザインの参考になるブログサイトを7つ選んでみました。 こうやって見ると、どのブログも記事が読みやすくて、ページの移動もしやすい優れたデザインばかりです。デザインについて話題になる記事をかける方たち。やっぱりブログも美しく構成されていますよね。 デザイン初心者さんも、新人デザイナーさんも、ベテランの方も、どんなに忙しくてもこれらのブログをチェックする時間をつくって、デザインについての情報を取り入れていきましょう。 常に変化していくのがデザイン。情報収集もデザイナーの仕事のうちです。 ではでは。

ECサイトのスマホデザインの参考にしたい!スマホデザインまとめサイト5選!

こんにちは、寝る前には布団の中でスマホでネットサーフィンが日課の相馬です。 仰向けでスマホいじってると、たまに顔に直撃落下して目が覚めちゃいますよね。 ここ2,3年でスマホユーザーが爆発的に増えると同時に、サイトのスマホ最適化の重要度も高まってきました。それはECサイトも例に漏れず、今後もスマホでネットショッピングをするユーザーは増えるばかりでしょう。 ECサイトの運営者の立場になると、リニューアルの難しいECサイトのスマホ最適化は頭を悩ますところだと思います。ECサイトはUIも大切。できるだけたくさんのECサイトのスマホデザインを見て、参考にしたいところです。 そこで今回は、ECサイトのスマホ最適化に役立ちそうな、スマホサイトのデザインを集めたサイトをピックアップ。 スマホサイトはPCのWebデザインとは性質が異なります。 ECサイトのスマホ化にお悩みの運営者さんは是非ブックマークして、参考にしてください。 ECサイトのスマホデザインの参考になるまとめサイト5選 AGT smartphone design gallery AGT smartphone design gallery 国内だけでなく、海外のイケてるスマホデザインも集まっているサイト。 サムネイルをマウスオーバーするとシュルシュル〜っとアニメーションでスクロールされて全体のデザインが見れます。 ショッピングタグでECサイトに絞り込めるのもウレシイです。 iPhoneデザインボックス iPhoneデザインボックス こちらも有名なスマホデザインまとめサイト。 大きな特徴は、各サイト詳細ページでスマホデザインとPCデザインのサムネイルを並べて見ることができる点。 これ地味に助かります。 こちらも「EC・ショッピングサイト」のカテゴリがあります。 iconDrop iconDrop こちらはスマホサイト全体のデザインでは無く、スマホのホーム画面にブックマークした時に表示される、Webクリップアイコンのまとめ。 Webクリップアイコンの有る無しでデザインのクオリティは変わってきます。スマホサイトを用意した時はぜひとも作成しましょう。 アプリのアイコンもありますが、いずれにしろ参考になるものばかりです。 thinkthing thinkthing こちらはユーザーが登録するタイプの優れたスマホサイトデザインのまとめサイト。 ユーザーが集めるだけ会って、国内外問わずデザインの数も豊富です。 ショッピングサイトのカテゴリも、すでに100サイト以上になっています。 Responsive Web Design JP Responsive Web Design JP こちらはスマホサイトのデザインに絞ったわけではなく、レスポンシブデザインだけを集めたまとめサイト。 スマホだけではない、デバイスの多様化の今後を考えると、運営しているサイトをレスポンシブにしておくことは重要かもしれません。 まとめ:スマホではより分かりやすく、使いやすく。 いかがでしょうか?この5つのサイトだけでも、十分すぎるほどのサンプルがあります。 スマホサイトとPCサイトではユーザーの環境や閲覧時間も異なるため、元のPCデザインのテイストを保ちつつ、ボタンのサイズや写真の見え方など、少し性質が変わってきます。 PCサイトと見比べながらスマホのデザインを見ていくと、沢山の新しい発見があります。 引き出しは沢山あればあるほど良いアイデアが生まれやすくなります。 ぜひぜひ暇な時にでも、これらのサイトをじっくり見てみることをオススメします。 ではでは。

Want to stay up to date with the latest news?

We would love to hear from you! Please fill in your details and we will stay in touch. It's that simple!