2015年12月28日（月曜日）

こんにちは。今週の担当をします原田です。
2015年最後のブログでございます。
今年も大変お世話になりました。ありがとうございました。
来年の干支は「申」ということで、アニメーション技術を埋め込んでこんなページを作ってみました。
ぜひ見てみてください。
他にもいろいろな種類の動きができるので、ホームページ製作に積極的に取り入れてみようと思います。
それではみなさまよいお年を。

2015年12月21日（月曜日）

こんにちは、今週のブログ担当の若井です。

今週はクリスマスがありますね。
今回はクリスマスカラーについて調べてみました。
クリスマスカラーといえば、主に赤、緑、白ですが、以下のような意味がありました。

赤…すべての人の罪を背負ったキリストの血の色、「愛と寛大」さという意味
緑…ツリーの色、もみの木などの常緑樹は1年中葉を付けていることから「永遠の命」という意味
白…雪の色、「純潔・潔白」などの意味

このように色の意味を知ると、行事やデザインの見方も深くなり、デザインする上でも役立ちそうですね。

2015年12月14日（月曜日）

こんにちは。今週は長谷がお届けいたします。

本日は「フォント」のお話です。
最近フリー素材で、色々なフォントがダウンロードでき、テキストにも色々な表情を作る事が出来る様になりました。同じ言葉でも、まるで雰囲気が違います。
こちらのイラストの様に、伝えたいトーンに合わせたり、イラストの雰囲気に合わせたりと、デザインを形成する要素一つ一つ、どれが一番ベストかを考えて制作していきたいです。

2015年12月7日（月曜日）

こんにちは。今週は原田はブログを担当します。
ウェブサイトを見る時に内容が多いと当然スクロールをしますよね??
そのスクロールをするタイミングに合わせて文章や画像をフェードインして表示させる方法があります。
このような動きを付けると少し手の込んだ印象を受けて、見ていてきれいに感じると思います。
スクロールに関するデザインもウェブサイトならではの表現なので、色々な方法を取り入れていきたいです。

2015年11月30日（月曜日）

こんにちは、今週のブログ担当の若井です。

画像にマウスオーバーしてみて下さい。
このように画像にアニメーションをつけることができます。
ロゴに動きをつけたり、ボタンに動きをつけることで、サイトに面白みが増すので、アニメーションを加えてみるのも良いですね。

2015年11月24日（火曜日）

こんにちは。今週は長谷がお届けいたします。
本日はPhotoshop加工についてのお話です。
写真をSNSの「instagram」等でよく見られるビンテージ風に加工してみました。 雰囲気がガラリと変わると思います。
Photoshopの色味加工で作成しました。 なんの変哲もない写真でも、簡単におしゃれな写真に加工してくれる事が「instagram」の人気の秘密だと思います。
デザインをやるものとして、今どの様なものが注目を集めていてどの様にして作られているのかを検証していく姿勢を、忘れないようにしたいです。

2015年11月16日（月曜日）

こんにちは。今週ブログを担当する原田です。
ウェブサイトを見る時はマウスオーバー（カーソルをボタンなどに当ててクリックしようとすること）する時がたくさんあります。
マウスオーバーにはいろいろな仕掛けやデザインを付けることができますが、今回は画像がズームするものをご紹介します。
いかがでしょうか？？コアラがこちらへ迫ってくるような感じがすると思います。
このようにマウスオーバーも工夫をしてみると、目を引くようなサイトが出来上がるのではないでしょうか。

2015年11月9日（月曜日）

今週のブログ担当の若井です。

今回は画像をスタンプ風に加工してみました。
ブラシとフィルタでかすれや滲みを出しました。

多少加工を加えることでまた違った雰囲気になり、デザイン幅が広がると思います。

2015年11月2日（月曜日）

こんにちは。今週は長谷がお届けいたします。

31日はハロウィンでしたね。都内等を歩いていたら、子供がジャックランタンの仮装をしているのを見かけました。５才くらいの女の子で、かぼちゃパンツをはいていて可愛らしかったです。
仮装も見かけますが、小物雑貨も随分と見かける様になりましたね。
今回はPhotoshopとillustratorを使ってハロウィンカードを作ってみました。 季節やハロウィンアイコンのイメージを考えながら、色味やレイアウトを考えてみました。
見た方の気持ちが少しでも動かせるようなデザインを目指して、日々精進していきたいと思います。

2015年10月26日（月曜日）

皆様こんにちは。原田です。
今回は久しぶりに、家で作ったハンドメイド品をご紹介します。
少し大きめのポーチ型の袋で、お弁当を入れたり、バックインバックにも使えるでしょうか…？
ミシンの扱いにも慣れてきたので他にも作っていけたらと思います。

2015年10月19日（月曜日）

今週のブログ担当の若井です。

今回も埋め込みのお話です。
右のように、コードを取得することでGoogleカスタム検索を自分のホームページ内に設置することができます。
ただし、無料で設置する場合、検索窓にあるようなGoogleブランドの文字を削除することは禁止されています。

以前にも埋め込みのお話をしましたが、埋め込みは無料でできるものもあり便利ですが、提供している企業の権利を表示することを忘れないよう注意し利用しなければなりません。

2015年10月13日（火曜日）

こんにちは。今週は長谷がお届けいたします。

今回はPhotoshop加工についてのお話です。
普通の実写写真を、ミニチュアの背景風に加工してみました。
「シャープ」や「ぼかし」、「色域指定」等を加味し、工夫してみるとこの様に、全く違う雰囲気のものに変身します！まだまだ試作中ですが、これからもっと洗練させていきたいと思います。 デザインをする上でこういった加工スキルが増えると創作に幅が出るので、より身に付けていきたいです。

2015年10月5日（月曜日）

こんにちは。今週は原田がブログを担当します。
イラストレーターには、「人」のシルエットが描画できるツールがあります。
これを利用して、好きな色をつけて背景に写真を入れてみると…オフィス街を人々が歩いている風景を作ることができます。
イラストと画像を組み合わせるとこのように面白い素材が出来上がり、ウェブサイトの中にも取り入れられますね。

2015年9月24日（月曜日）

今週のブログ担当の若井です。

スマホでホームページを見る際に指でつまむようにして画面を拡大させるピンチアウトをすることがあると思います。
小さな画像をピンチアウトするとぼやけてしまう為、スマホサイトに使用する画像は大きめに作成し、同倍率で縮小して配置しています。
スマホサイト作成の際の工夫の一つです。

2015年9月14日（月曜日）

こんにちは。
今週は長谷がお届けいたします。

今週はイラストレーターの加工についてのお話をさせて頂きます。 弊社の来年の年賀状を作成させて頂く事になったので、少しずつデザインを考えているのですが、判子の質感をデジタルで再現できないかと思いチャレンジしてみました。
イラストレータの機能でパスの線の形状を「ラフ」にくねらせるツールで作ってみました。まだまだ発展途上ですが、本物に少し寄せられました。 勉強を重ねて加工スキルをより高めていきたいと思います。

2015年9月7日（月曜日）

みなさまこんにちは。今週のブログを担当します原田です。
以前ご紹介した「パララックス（視差）」というウェブ技術を覚えていますか？？
今回はそれをさらに発展させてお話しします。サンプルページをスクロールしていくと、3枚の画像がそれぞれ違うスピードで動いていくのが分かると思います。（ゆっくりスクロールしていくと分かりやすいです。）
こうすることで、雨粒がパラパラ落ちてくるような上下の動きと奥行きのある背景画像が出来上がります。
背景のデザインにもこだわってウェブ製作をしていきたいと思います。

2015年8月24日（月曜日）

今週のブログ担当の若井です。

今回も前回に続き、埋め込みのお話です。
右のように、コードをHTMLに貼るだけでマップも埋め込むことができます。

サイトのアクセスページになど使用できますし、縦横のサイズも指定できるので、サイトの幅にあった大きさで埋め込めます。

2015年8月18日（火曜日）

こんにちは。
今週は長谷がお届けいたします。

今回は、大理石の素材をデザインソフトを使って再現してみました。 高級感などを出しやすい大理石は高級ブランドのサイトデザイン等に使用すると、一気に重厚感が増す効果があったりと、使用頻度が高いです。
デザインで使用する素材等はよくフリー素材を使うのですが、フリー素材に頼ってばかりではなく、これからは自分で作成できるスキルも身に付けていきたいと思いました。

2015年8月10日（月曜日）

こんにちは。原田がお送りする今週のブログは画像の加工についてです。
上の元画像を「ぼかし」や色調補正などで工夫してできたのが下の画像です。
少し絵画チックな雰囲気になっているでしょうか？？
画像全体が青緑に色がまとまって、ペンギンの黄色い部分がより鮮明に見えるような感じですね。
このような加工をすることで画像の見え方が違ってくるので面白いと思います。

2015年8月2日（月曜日）

今回のブログを担当します、若井です。

今回はSNSの埋め込みについてのお話です。
右のようにツイッターボタン等をホームページに埋め込むことが出来ます。 これはコードをHTMLに貼るだけです。
他にもfacebookやLINEのボタンや、facebookやTwitterのTLを埋め込むことも出来ます。

このようにSNSを埋め込むことで、情報をシェアしやすくなり、ホームページのアピールにもなると思います。

2015年7月29日（水曜日）

こんにちは、今週は長谷がお届けいたします。
梅雨明けはしましたが、台風の影響等もあってぽつぽつと雨の日がありますね。
今回は、気持ちが暗く成りがちな雨の日を少し楽しい気持ちにしてくれる「傘」のデザインを見つけたので、ご紹介します。
ご存じの方もいらっしゃるかもしれませんが、図の様に、表面に水気が当たると模様が浮き上がってくる仕組みの傘です。
好きな柄だったりすると、雨の日が楽しみになるかもしれません。
マイナスイメージをプラスに変える、デザインの可能性を感じた素敵な出会いでした。

2015年7月6日（月曜日）

今週のブログは原田です。
7月に入りましたね。まだまだ梅雨の時期ですが明日7日は七夕です。
晴れるといいですがお天気はどうなるのでしょうか？？
今日はそんな季節に合わせて星空の画像素材を作ってみました。
フォトショップで自由にペイントしたり、白い点を散りばめるツールや靄をかけるツールなどを組み合わせるとこのような仕上がりになります。
他にも色々な素材作りにチャレンジしていきたいです。

2015年6月29日（月曜日）

今週のブログを担当します、若井です。

今回はスマホサイトを作成する上での工夫のお話です。

画像のボタンを押してみてください。
隠れていたテキストが出てくると思います。
再度ボタンを押すと、テキストが収納されます。

小さなスマホサイトの画面に、PCサイトと同じ量の情報を入れる為には、 このような工夫もされています。

2015年6月22日（月曜日）

こんにちは、今週は長谷がお届けいたします。

こちらの○ボタンにアイコンを合わせると、カラフルな円がアニメーションされます。一見なんの変哲もない○ですが、こういった仕掛けがあると、見た目にも楽しいものです。

サイトをご覧になって下さった方に少しでも「楽しい」「きれい」などと感じてもらえる様に、工夫を欠かさない様にしていきたいです。

2015年6月8日（月曜日）

今週のブログを担当します原田です。
ホームページ製作には「CSS」という技術がありまして、コード表記だけで図柄や図形を作ることができます。 サンプル画像の点線の白枠が今回CSSで作ってみた部分なのですが、背景のデニム素材と組み合わせると糸の縫い目のような仕上がりに見えるでしょうか？？
画像を使うだけでなくCSSも取り入れることによってデザインの幅を広げていきたいと思います。

2015年6月1日（月曜日）

今週のブログを担当します、若井です。

最近ではスマホでサイトを見る機会が増えて来ました。
スマホサイトでは、画像のようなメニューボタンを多く見かけますが、 右側部分のリンク先があることを表す矢印は、CSSで作成することができます。
角度の指定を変えれば、上下左右の矢印がどれも作成できます。
スマホサイトならではのデザインを今後も取り入れて行きたいと思います。

2015年5月25日（月曜日）

こんにちは、今週は長谷がお届けいたします。
最近お天気は変わり易いですが、気温が高い日が続きますね。 近所からは、もう風鈴の音色が聞こえて来ました。
そんな訳で本日は、風鈴のデザインのお話をしようと思います。 風鈴は素材や形も様々で、その数900、それ以上とも言われています。 中でも有名なのはガラスで作られた江戸風鈴ですね。 風鈴の音の決め手は、ガラスの切り口をあえて“ギザギザ”にすることだそうです。 均等にするとあの涼やかな音が出ないのだそうです。 デザインには見た目だけでなく。音の美しさを追求したものもあると知り、とても勉強になりました。

2015年5月18日（月曜日）

今週のブログは原田です。
今回は、「パララックス（視差）」という視覚効果を取り入れたウェブサイトについてご紹介します。（サンプルページを作ってみたのでぜひ見てみてください。）
ページを下へスクロールしていくと、流れるような動きというかなんとも不思議な画像の見え方になりますね！
このような作りにすることで次から次へとページの閲覧を促すことが期待されます。
サイトを見ている方に「もっと見たい！」と思わせるようなサイト制作をしていきたいです。

2015年5月11日（月曜日）

今週のブログを担当します、若井です。

今回はフォトショップでしわのある紙を作成してみました。
黒と白のグラデーションをランダムにかけ、エンボス加工をしたりすると、このような素材ができます。

デザインに合った素材を使用できるように、日頃から素材のバリエーションを増やして行きたいと思います。

2015年5月7日（木曜日）

こんにちは、今週は長谷がお届けいたします。
今回作成したものに重量感を追加したくて、細部に素材を足しました。
四つ角にちょっとした「ネジ」のようなものを付け足すだけで、重みや存在感が増します。
小さい事でも、少しの拘りで、より説得力のあるものに近づけるので こういった意識をつねに持ちながら、デザインをしていきたいと思いました。

2015年4月27日（月曜日）

今週のブログは原田がお送りします。
みなさんは文字や画像が画面を横切って動いているウェブサイトをご覧になったことはありますか？？
サンプルページのようにニュースやトピックスなど、特に見てもらいたいところを動かして注目させる手法があります。こうすることで他のコンテンツに埋没することなく大切な情報を載せることが出来ます。
点滅させたり、色々な動きを設定させることもできるので、効果的にウェブ製作に取り入れていきたいです。

2015年4月20日（月曜日）


今週のブログを担当します、若井です。

今回は、床に反射するテキストを作りました。
反射部分は、同じテキストをコピーし反転させ、不透明度を下げ、白のグラデーションをかけて作りました。

画像も同じ方法で反射させることができます。
反射部分があるだけでちょっとした装飾になるので良いと思います。

2015年4月13日（月曜日）


こんにちは、今週は長谷がお届けいたします。

今回作成したものは、「click」付近にカーソルを合わせると、見えていなかった画像が現れるというものです。
実はこれ、画像の上に真っ白な画像をのせ、カーソルを合わせると白い画像の透明度を変える、という仕組みになっています。
工夫を重ねていけば、単純な動きも新鮮なデザインに変化します。
とても簡単ですので皆様も試してみてください！

2015年4月6日（月曜日）

今週のブログを担当します原田です。
ウェブサイトは様々なウィンドウサイズで見ると思いますが、そのウィンドウに合わせて画像を表示させることが出来ます。 ウィンドウを小さくしたり大きくしたりしても、ちゃんと画像も一緒に伸び縮みすることでどんな環境でも閲覧しやすいサイト作りが出来ます。
サンプルページを作ってみたのでぜひブラウザを開いて試してみてください。

2015年4月1日（水曜日）

今週のブログは若井が担当致します。

最近クリエイターズスタンプという言葉を耳にしたことがあると思います。 LINEスタンプを、一般の方でも作成し販売することができるものです。
私も画像のようなスタンプを作成し販売を開始してみました。
クリエイティブなことに興味がある方は一度はチャレンジしてみてはいかがでしょうか。
とても楽しいですよ。

2015年3月23日（月曜日）


こんにちは。
今週は長谷がお届け致します。

本日は写真デザインに関してのお話です。 元画の様に、ただ写真を配置するだけでは寂しく、何か物足りないですよね？
写真の周りに白いフレームを追加したり少し影を付けたりと、「リアルさ」を加えるだけで ぐっと魅力が上がります。
この様な事を意識しながら、より洗練されたモノを創っていきたいものです。

2015年3月16日（月曜日）

今週は私、原田がブログを担当します。
DACでは時計やジュエリーなどを扱うお客様のウェブサイトを手掛けることが多いですが、その際の商品の画像処理はとても大切です。
デザイナーとしては、何よりも、商品が元来もっている素材の良さや質感の良さ、色合いの深みなどを、ご購入される方にしっかり伝えることが一番大切なことと思って画像を扱っています。
また、お客様から特にご要望があった場合は、イメージカットとして、画像を切り抜いたり、色を付け足して塗ったり、グラデーションをかけたりするなど、画像処理に工夫をこらすこともあります。
この画像は、ネックレスの中心をはっきり見せ、両端を霞ませて、ネックレスが浮かび上がっているように仕上げています。
大切な商品画像を扱うときには、細心の注意を払って取り組んでいきたいと思います。

2015年2月23日（月曜日）


今週は若井が担当します。

今回はマウスオーバーしたときのボタン等のデザインについてです。
画像にマウスのカーソルを合わせると画像が変わると思います。
このように、マウスオーバーしたときに画像を変えることが出来ますが、 HPを華やかにする手法の一つだと思います。

2015年2月16日（月曜日）


こんにちは。
今週は長谷がお届け致します。

こちらはデザイン作成時に作成したものです。
元々「布」の画像だったのですが、今回描画の変更処理等をし、テクスチャとして使用しました。色々なものを掛け合わせて素材自体を作成すると、デザインの幅が広がっていきますね。

2015年2月9日（月曜日）

今週のブログを担当します、原田です。
今回の画像はなにやら玉ねぎの絵が描かれていますが、、、これはウェブページのタイトル部分として作ったものです。
ページ全体が柔らかい印象のサイトだったので、それに合わせてデザインしようと考え、輪郭線だけの絵と白抜きの絵をそれぞれ描いて、単調にならないように組み合わせてみました。 タイトル文字の背景としてイラストを入れてみるのも面白いと思います。

2015年2月2日（月曜日）

今週のブログは若井が担当します。
今回は、右の画像のようにテキストの背景色を半透明にさせる方法についてです。
フォトショップ等で背景色を半透明にした画像を作成する方法もありますが、cssで背景色を指定し、その背景色をopacityやrgbaで半透明にすることも出来ます。
画像で作成するか、コードで作成するか、その時々によって適した方法をとりたいと思います。

2015年1月26日（月曜日）

今週は長谷がお送りいたします。
先週は、今年の初雪がみられましたね。
暦の上では１月20日は「大寒」ということもあり、芯から冷える日々が続きますね。 先週の雪をwebで再現してみたく、コーディングしてみました。 動きやイメージを変えれば、花びら等も散らせる事ができます。 表現力をもっと磨き、多用なものを創れるようになりたいと思いました。

2015年1月19日（月曜日）

新年あけましておめでとうございます。2015年もよろしくお願いします。
今週、原田がお送りする記事は文字のデザインについてです。
文字と聞くとテキスト入力されたものが思い浮かべがちですが、右の画像のようにイラストチックに表現することができます。色々な柄をそれぞれの文字の形に切り抜いて作っているのですがポップな感じに仕上げられます。
入力された文字だけでなく、自分で描いてオリジナルに作ったものを使ってみるのも良いですね。

2015年1月13日（火曜日）

新年あけましておめでとうございます。 今年も宜しくお願い致します。
今週のブログは若井が担当します。

昨年の年末から今年の年明けにかけ、雪の降る地域では積雪量が多く大変ですね。 画像は、フォトショップでフィルタのノイズやぼかし機能を使い、雪が降っている図を表現してみました。

雪の事故に気を付け、春を迎えたいですね。

2015年1月5日（月曜日）

謹んで新年のお慶びを申し上げます
　　　　　　　　　本年も何卒よろしくお願い申し上げます

今週は長谷がお送りいたします。
さて、本日は年賀状のお話です。
近年　年賀状を送る人が少なくなっているそうですが、一年の最初にご挨拶をするというのは、するのもされるのも気持ちのよいものですよね。
年賀状の冒頭に使用する言葉「賀詞（がし）」も「謹賀新年」「迎春」「賀正」「寿」「福」など様々です。「賀詞」とちょっとしたコメントを添えるだけで立派な年賀状です。
重く考えず、触れる機会が少ない方に、もっと身近に年賀状文化を感じてほしいと思いました。