creative memomemo Webデザインtips,Photoshoptips,クリエイティブでステキなものをまとめているブログ。 こんにちは、井畑です。 先日1/20に、前々から作りたいなーと思っていた、ごはんメモブログ「クリエイティブモグモグ」をリリースしました! 今回はそのご紹介と、デザインやコーディング時にこだわったところや頑張ったところなどをまとめたいと思います。 それではどうぞー!! クリエイティブモグモグとは クリエイティブモグモグは「大好きな人たちとおいしいご飯を食べる為のメモブログ」というコンセプトのもと、産まれたごはんメモブログです。 もともと、美味しいものを食べるのも作るのも大好きだったので、制作する構想はずーっとあったのですが、やっと公開することができました。作る情熱を持ち続けるのはなかなか大変ですねー(遠い目) カテゴリーが「作ってみた」「行ってみた」「ご

こんにちは。冬はもっぱら一人鍋井畑です。最近ぐっと寒くなってきましたね。 今回はGIFアニメーションの効果的な使い方や上手く見せるポイントを語ろうと思います。以前から結構作る機会があって割と慣れ親しんでおり、好きなんですー!GIFアニメ;D 紹介する為にGIFアニメを貼りすぎてページが若干重いですがご了承下さい。それではどうぞ!! GIFアニメーションとは GIFアニメ。Web上で動きのある表現方法の一つです。パラパラ漫画のように何枚かの静止画が時間ごとに切り変わる仕組みです。 GIFアニメの他にもjQueryやFlashやCSS3等で動きのある表現ができますが、一番昔からある手法です。(多分) 昔からある分、古くさいとかサイト表示が遅くなるなど、敬遠されがちな部分もあります。しかし、難しい技術も必要無く作成でき、どんなブラウザでも同じように表現されるGIFアニメが僕は好きです。 そりゃあ

こんにちは。食欲の秋まっしぐら井畑です。 今回は、Photoshopのショートカットを整理していたらステキな設定を見つけましたので、ご紹介したいと思います。 そのステキな設定とは「レイヤースタイルのコピー＆ペースト」のショートカットです。結構めんどくさい作業だったのですぐに設定しました;) さぁ詳しい説明しますよーそれではどうぞ!! レイヤースタイルのコピー/ペーストを設定すると幸せになれる レイヤースタイルって何？ ショートカットの説明の前に、レイヤースタイルについて軽く説明をしておきます。 レイヤースタイル(レイヤー効果)とはPhotoshopでレイヤー(図形レイヤーや文字レイヤーetc…)にたいして装飾や効果を設定できる機能のことをいいます。これを使えば、長方形に境界線をつけたり、文字にドロップシャドウをつけたりするのがとても簡単にできるようになります。 レイヤースタイルは一度作成す

こんにちは。Photoshopの起動と共に目覚め、Photoshopの落ちとともに眠ります。井畑です。 最近、縦に長いバナーを作る事が多く、それに伴い縦で文字組する事が多くありました。 その時に困ったのが「!」や「半角英数」の扱い 普通に打つと「!」や「半角英数」は横に寝てしまうので、いちいちその部分だけテキストボックスを分けて作成していましたが、後輩に簡単でスマートなやり方を教えてもったのでご紹介いたします。(ありがとう後輩!!) それではどうぞ!! まずは例を置いておきますね。 例の様にPhotoshopで縦書きに文字を打つと「!?」が横になってしまいます。 「縦中横」にチェックを入れればスマートに縦書きに 「!?」だけ別途テキストボックスを作ればもちろん縦にできますが、これを回避するスマートな方法があります。やり方は簡単。 縦にしたい箇所(テキスト)を選択して、[文字パネルのメニュー

こんにちは。今日も元気にPhotoshopと戯れます井畑です。 今回はPhotoshopの文字詰めに使うツールについてちゃんと調べてみました。 今では息をするように文字詰めをしていますが、デザイン初めたての時は勝手が分からず苦労しました…Photoshopの文字詰め♪ 基本的なことがほとんどなので、知ってる人にとっては当たり前のことですが、おさらいによろしければご覧ください。 それではどうぞ！ ちょっと待って文字詰めって何？ まずは文字詰めが何か分からない人の為に軽く説明しておきますね。 ワンランク上のデザインにはかかせない文字詰め 文字詰めとは読んで字のごとく、文字と文字の間を詰めてバランスをとる作業のことです。 通常文字を打っただけでは「ベタ組み」と呼ばれ、基本的に文字と文字の間が空きすぎています。それを詰めてデザインのバランスをとります。 WEBの性質上テキストデータの文字詰めは難し