Webデザイン

Webデザイン

文字装飾パターン集

バナーやキャンペーンの画像を作る際、ゴテゴテのグラデーションやテクスチャをふんだんに使った文字装飾、大変ですよね。 大体値段やキャンペーンの内容となると分かりやすく金赤やゴールドが使用されるので毎度毎度マンネリになりがちだったりします。 そこで今日は、文字装飾のパターンを集めました。 Fireworksで開いてコピーし、「Shift + Ctrl + Alt + V」の属性をペーストを行うとそのままご自分のデザインに反映できます。

Webデザイン

高品質なのにフリー!背景に使えるテクスチャ配布サイト

こんにちは、工藤です。 梅雨が明けてもうすっかり夏ですね。暑いです。 今日は背景素材を無料で提供してくださっているサイト様のご紹介です。 パターンテクスチャなんかはたまに自作するとはまったりするのですがたくさんの種類を作るとなると心が折れてしまったりするので、無料で使わせていただけるのはありがたいです。 Subtle Patterns WEBサイト 背景画像と言えばここかなというぐらい高品質な素材を配布してくださっています。 基本的にシンプルなものが多いので微妙にアクセントが […]

Webデザイン

【キャラクターデザイン】

今、社内でスマートフォンアプリを作りたいなぁと相談していたりします。 爆発的に流行るアプリなんかはやはりキャラクターが決め手だったりするんですよね。アルパカやマンボウ、なめこetc…可愛らしいですよね。私もちょこちょこと使用したいキャラクターをぼんやり考えてみたりしています。 せっかくなので綺麗に書き直してこちらに載せることに。

Webデザイン

TwitterまんがPart30

おはようございます。毎日暑いですね。私はというもの、相変わらず夏になるとバテてしまいます。皆様いかがお過ごしでしょうか。 最近の社内では夏に向けての(もう夏ですが)ダイエットも兼ねてか、「そば部」が発足しています。特に改めて部をつくったわけではないのですが、なんとなくランチにざるそばを食べる習慣ができてしまいました。いつもつい、3人くらいで蕎麦をすすっています。今のところはローソンのいなりずしがセットになっているのが一番人気です。曰くあまり無理して蕎麦だけで我慢すると「夕方く […]

Webデザイン

「LINEスタンプシュミレーター」を作りました。

LINEクリエイターズスタンプ、だいぶ盛況のようですね。審査を無事通過してマーケットに乗ったスタンプも4000を超えたようです。私もいくつか購入して使用してみたのですが、どうも実際にトークの場で貼られるとスタンプがなんかでっかい…。 制作している時は気付かないものなのですが、規約の370*320pxにめいっぱいで作ると実機で見ると全く違ったサイズ感になってしまい、結局なんだか使い心地が良くなくてそのまま使わなくなってしまったりします。 そこで失敗しないためにも、「LINEスタ […]

Webデザイン

Webデザインのときに重宝するChromeの便利な拡張機能

こんにちは、工藤です。 Webデザインのときに私がよく使うChromeの拡張機能をご紹介したいと思います。 無駄にウィンドウを開いておくことが多いため、ブラウザ上で色々出来るのは本当助かります・・。 Awesome Screenshot Chrome ウェブストアへ 例えば「ここのフォントサイズを変えたらどうなるんだろう?」とふと思ったときに、ブラウザ上で試しに編集をして確認をできたりするのが『Firebug』です。もちろん保存はできないです。 firefoxにも『Fireb […]

Webデザイン

【商用利用可】フリー素材配布サイトのまとめ

こんにちは、工藤です。 今回はwebデザインに欠かせない、商用利用可のフリー素材を配布してくださっているサイト様をまとめました。 利用規約等は各サイト様でご確認いただければと思います。 写真素材 イラスト素材 アイコン系素材 写真素材 写真素材 足成 http://www.ashinari.com/ とにかく扱っている写真の種類が多いサイトです。 ここを見るとだいたい欲しいな、と思っている風景写真に出会うことができるのでありがたいです。 PAKUTASO/ぱくたそ http: […]

Webデザイン

手書き風アイコン素材25個

今回は、アイコン素材を制作してみました。 ゆるい雰囲気の手書き風アイコンです。カラーもビビッドめにまとめました。 あぁーー、これね、こういうのよく使うよー、といった感じのを重点的に。 フリー素材で、商用可です。まとめてダウンロードはこちらから。 Fireworksで開くとパスデータになっています。 近況 オフィスの窓を開けると、とても綺麗な紫陽花が咲いています。 今年の梅雨は長いと聞いていたのに、もう明けてしまうなんて噂もちらほら聞きますね。あまり雨が降っていない様子ですが、 […]

Webデザイン

参考にしたいレスポンシブのサイト

こんにちは、工藤です。 ただいまレスポンシブの勉強中・・というか効率的な進め方を模索中です。 それぞれ1つのファイルで済む分、ソースが汚くなってしまったりUIの面で悩んでしまったり、なかなか難しいです。 そんなこんなで今回は参考にしたいレスポンシブのサイトを集めさせていただきました。 日本語サイトのみのご紹介です。 参考にしたいレスポンシブのサイト ゆい動物病院 http://yui-ah.com/ ウィンドウを小さくしてもテイストが損なわれないのがすごいです。 項目もそれぞ […]

Webデザイン

【Fireworks】人物シルエット素材11枚

弊社のある渋谷は今日も雨です。梅雨の時期、じめじめして嫌になってしまいますね。湿気は苦手です。 さて、今日は久しぶりに人物のシルエット素材を作成しました。Fireworksのパスになっています。 私用商用自由にご利用ください。zipはこちらから。 色の違う所は取り除いたりできるようになっています。 素材

Webデザイン

参考にしたいバナーまとめ

こんにちは。ここ最近は天候が安定しないですね・・。 さて今回はバナーを集めました。 大きめのバナーは余白の埋め方が難しいなあとふと思ったので大きめのものが多いです。   参考にしたいバナー 今回はこのあたりで。

Webデザイン

ソーシャルボタンの種類を調べてみました

こんにちは。 今回はソーシャルボタンってどれくらいあるのだろう・・と思って調べてみました。 すべてではないのですが結構見かけるなあというものをご紹介します。 ソーシャルボタン一覧 twitter 設置はここから 自分の気になる記事をほかの人にも見てほしい時に便利なtwitterのボタンです。 そのほかにも『フォローする』など結構種類があります。 以前は公式でももう少しボタンのカスタマイズができたと思うのですが・・。 上の画像のようなふきだしが上にきているものは『data-co […]

Webデザイン

TwitterまんがPart29

おはようございます。すっかり初夏の陽気ですが、皆様如何お過ごしでしょうか。 私はというもの、花粉症のような症状で一日中クシャミが出て悩まされております。今年初めてのことなのでどうやら花粉症デビューしてしまったようです…つらいですね。 さて、今日もまんがを書かせて頂きました。 私はじわっと来るようなシュールなネタが好きなんですが、どうでしょう。お仕事の合間、息抜きになれば幸いです。 噛んだ? 本日書かせて頂いたツイート 今日のツイートはこちら。 最近私も頭ではカルピスサワーって […]

Webデザイン

【デザインまとめ】キャンペーンサイト20選

こんにちは、今日はキャンペーン系のサイトを集めてしました。 キャンペーンサイトはキャプチャを撮っておかないと気づいたら消えてしまっていて、しまった撮り忘れていた・・!ということがよくあります。 以下の情報は2014年5月21日現在のものとなります。 キャンペーンサイト サントリー和膳 「5つ星お米マイスター」厳選!和膳に合うお米、当たります。 http://www.suntory.co.jp/beer/wazen/present_cp/ どっちのオールフリーでカンパイ!? h […]

Webデザイン

おすすめ日本語フリーフォントのまとめ

フォントは色々欲しいですけれど個人で買う分にはお財布事情が・・となってしまったりしますよね。(もちろんその分の価値はあるのですが) 今回は個人的にお世話になっているフリーフォントをご紹介したいと思います。 フリーフォント一覧 MigMix(ミグミックス)フォント M+とIPAの合成フォント M+フォントさんに漢字が補完されたフォントです。 ご紹介したもの以外にもサイトに色々な種類があるので使い分けできて便利です。 やさしさゴシック やさしさゴシック – フォントな […]

Webデザイン

【デザインまとめ】綺麗なデザインの管理画面 40種類

今日は管理画面のデザインを、まとめてみました。いつもより多めな40種類です。トレンドを反映してか、フラットデザインが多いですね。 通常の静的なサイトのデザインとは異なり、投稿がある場合無い場合とたくさんのパターンを考えながら制作しなければならないので、デザイン力が問われます。これらを日本語に置き換えるとまた違って見えたりするのですが、ひとまず、ご参考になればと思います。 ▼ The Kamarel デモサイト ▼ Apricot Bootstrap デモサイト ▼ The V […]

Webデザイン

【キャラクターデザイン】キャラクターの喜怒哀楽や行動を表すパターン

キャラクターのデザインをしていて基本的なことなのですがそれぞれのキャラクターに喜怒哀楽の表情があると思います。 それを表現するにあたって喜怒哀楽・行動のパターンを表すまんが記号や表情のパターンを並べてみました。 普通の表情 今回はこちらの蟹のキャラクターを使います。これが何もないシンプルな状態。 驚く 王冠のようなマークで驚きを表現します。これは簡単。 悲しむ 一番分かりやすいのが涙。大げさに流すくらいが分かりやすい。白目になったりもいい。 照れる 斜線を使って少し頬を赤らめ […]

Webサイト制作

どうしてデザインはなかなか一発OKにならないのか。

デザインをデザイナーが制作をしてディレクターが確認・修正指示してデザイナーが修正して、クライアントが確認してデザイナーが修正してといったことが工程が制作では繰り返されます。 そういった過程の中でせっかく最初にデザイナーが作ったデザインは跡形もなくなっている場合も多くあります。 正直な気持ち一発OKであればそれが一番だと思います。 そう思っているので、毎回イメージのすり合わせを行っているのですが、これがなかなかうまくいかない。 自分はこういった筈なのに、完成したものが異なるから […]

Webデザイン

【デザインまとめ】海外のポートフォリオサイト15選

GWの中日、皆様いかがお過ごしでしょうか。通勤の電車の中も行楽の雰囲気が凄まじいですね。 お天気も良いですしどこかに出かけたくなりますね。弊社はカレンダー通り営業しております。 さて、今日は海外のポートフォリオのデザインをご紹介したいと思います。 国内にももちろん素敵なデザインやギミックのものがたくさんあるんですが、海外の個性色濃いサイトにどうしても憧れてしまいます。どうしてあんなに素敵に見えるんでしょうね。(外国語だからというのもあると思いますが…) 作り手の自己満足と言っ […]

Webデザイン

Webデザインをパーツで参考にできるサイトまとめ

こんにちは、工藤です。 Webデザインの際、パーツで悩んでしまうことがよくあります・・。 今回はパーツ毎にまとめてくださっているサイトをご紹介します。日本語サイトが多めです。 パーツ全般を集めているサイト ブブンデザインアーカイブ http://bubundesignarchive.jp/ Croppy http://croppy.org/ MephoBox http://box.mepholio.com/ メインビジュアル関連 WEBデザインのメインビジュアルまとめ htt […]

Webデザイン

TwiiterまんがPart28

おはようございます。今日もぽかぽか暖かいですね。 最近の私はというもの、プライベートで話題のLINEスタンプを制作しています。 40個というボリュームをいかにクリアするか、それが課題ですがなんとか審査を通す所まで持っていけるよう頑張っています。 さて、本日の本題ですが、今日も漫画を書きました。 今日はちょっとしんみり。 繁忙期 本日書かせて頂いたツイート 今回書いたツイートはこちら。 先月の年度末の繁忙期、みなさんてんやわんやだったようですね。 こんなぽかぽか陽気だとふらっと […]

Webデザイン

よくお世話になるjQueryプラグインまとめ

こんにちは、工藤です。 今回はよくお世話になるjQueryプラグインをまとめました。 コードがまったく書けない人間なのでありがたいです・・。 yuga.js yuga.js公式ページ お名前の通り、『Web制作を優雅にするために』作られたそうです。 このブログでもお世話になっています。 まずはjQuery本体と『yuga.js』をheadで読み込みます。 ロールオーバー ロールオーバー時に画像を切り替えることが出来ます。 やり方はすごく簡単で ロールオーバー前の画像と、ロール […]

Webデザイン

「コメ展」に行ってきました。

先日、企画展「コメ展」に行ってきました。 会期:2014年2月28日(金) – 2014年6月15日(日) 展覧会ディレクター:佐藤卓、竹村真一 会場:六本木 21_21 DESIGN SIGHT URL:www.2121designsight.jp/program/kome/ 名前からしてお腹が空いてきそうですが、素敵な展覧会だったので折角なので記事に。 展示場内は静止画なら自由に撮って良いとのことで、Twitterのハッシュタグ「 #コメ展 」で呟くと展示場内 […]

Webデザイン

Illustratorで歯車をつくろう!

こんにちは。 今日は8bitのサイトのTOPでも使用している『歯車』をIllustratorでつくってみます! 私もまだまだ勉強中なのですが・・。なんとなくパスの感覚を掴むのにもってこいだと思います。 ■今回はIllustratorCS5を使いますが、おそらく他のバージョンでも違和感なくできるかと思います。

Webデザイン

TwiiterまんがPart27

おはようございます。今朝も寒いですが皆様いかがお過ごしでしょうか。 最近の私は、週末川崎ラゾーナへと出向き、パンケーキ部などしておりました。 あまーいパンケーキも悪くないですが、やっぱりアボカドが乗っていたりするミールパンが好みです。 左がロージーズカフェのマッシュルーム&ベーコンサラダ、右がジェイエスのサーモンアボカド 美味しいごはん、幸せですね。お昼前にお腹がすいてしまいます。 さて、今日のTwitterまんがですが、今日はちょっと思わずお腹がすいてしまいそうなツイートを […]

1 3 4 5 6 7 10