Asial Blog

Recruit! Asialで一緒に働きませんか?

和田記光

ディレクター/デザイナー

約10年間、DTPに携わっていたが、Webの魅力・将来性に惹かれ転職。アシアルにデザイナーとして入社。
DTPに携わっていたのが長かったせいか、Illustratorの操作感に近いFireworksを愛用。そのため、少数派?なFireworksの普及を心より望んでいる。

たずさわった仕事

iPhone6 PlusのPSDモックアップとAppleのフォント

カテゴリ :
デザイン・UI
タグ :
iPhone6 Plus
Mockups
フォント
Apple WATCH
みなさんお久しぶりです。
デザイナーの和田です。

iPhone6 PlusのモックアップをPSDで作成しました。
公開いたしますので、お使いになりたい方はダウンロードしてください。商用利用可です。

SVGと画像ファイルの容量の差を検証-2 〜PNG,GIF追記〜

カテゴリ :
デザイン・UI
タグ :
Photoshop
Illustrator
SVG
PNG
GIF
図−1 四角のチャート
こんにちは。和田です。
とうとう12月になりました。今年もあと1ヶ月弱。時間が経つのは早いですね。

さて、今回は前回に引き続きといいますか、
「PNG,GIFとSVGを比較した方がよいのでは!?」というご意見いただきましたので、そちらの比較をしてみようと思います。

SVGと画像ファイルの容量の差を検証

カテゴリ :
デザイン・UI
タグ :
SVG
Illustrator
Photoshop
PNG
JPG
図−1 四角のチャート
こんにちは。和田です。
今後数回に分けて、デザイナー視点でSVGファイルについて書いてみようと思います。
(あくまでデザイナー視点ですのでIllustratorで作成した図をSVG保存して、どうなるか…みたいな事を書いていきたいと思います。)

Fireworksでちょっとリアルな雲を描く方法

カテゴリ :
デザイン・UI
タグ :
Fireworks
リアル
完成
こんにちは。和田です。
最近、だいぶ秋らしくなってきました。
上空は秋晴れの奇麗な空が広がっています。
そんな空を眺めていて、
ふっと、
簡単にFireWorksでリアルな雲は描けないかな…と思いチャレンジしてみました。
むちゃくちゃリアルではないですが、まぁそれなりに、それっぽくなったのでブログに書いてみようと思います。

スマホ&タブレットの解像度(ppi)ベスト3

カテゴリ :
デザイン・UI
タグ :
iPhone
スマートフォン
解像度(ppi)
icon
こんにちは。和田です。

最近のiPhoneは解像度(ppi)がとても高いですよね!
と、感動していたのですが、ふと実際に流通している他のスマホの解像度(ppi)ってどうなっているのだろうと思い、ちょっと調べてみました。
そうしたら、iPhoneよりも高いppiのデバイスってあるんですね!
これまた驚きです。

レスポンシブデザインのウインドウサイズの切替えについてまとめてみました

カテゴリ :
デザイン・UI
タグ :
レスポンシブデザイン
スマートフォン
タブレット
デバイスの横幅リスト
こんにちは。和田です。

今回はFireworksから離れて、最近なにかと話題のレスポンシブデザイン-特にウインドウサイズの切替えについて書こうと思います。

イコライザーをFireworksで描いてみました

カテゴリ :
デザイン・UI
タグ :
Tech
Fireworks
UI
デザイン
01.jpg
こんにちは。和田です。

最近、会社の中で音楽を趣味にしていたり音響に詳しい人たちが増えて来たように思えます(今まで知らなかっただけかもしれませんが…)。
ということで、今回は音楽ネタを描こうと思います。

描くものはイコライザ—です。
出来上がりはこんなイメージです。

iCloud風のアイコンを作成する(Fireworks)

カテゴリ :
デザイン・UI
タグ :
Tech
Fireworks
アイコン
iCloud
土台?の矩形
こんにちは。和田です。

今回はiCloud風のアイコンをFireworksで作成したいと思います。
オブジェクトは3つだけで作成できるのでとても簡単です。

いくつかバリエーションを作ってみました。
↓仕上がりイメージはこんな感じです。

2つのオブジェクトで古い紙の質感を作る(Fireworks)

カテゴリ :
デザイン・UI
タグ :
Tech
Fireworks
古い紙
グラデーションの設定
今回は、2つのオブジェクトで古い紙の質感を簡単に作ってみようと思います。

3ステップで写真を水彩画風にする方法(Fireworks)

カテゴリ :
デザイン・UI
タグ :
Tech
Fireworks
水彩画風
before-after-01.png
今回は、3ステップ(30秒以内)で写真を水彩画風にする方法をお伝えいたします。
とてもとでも簡単です。
ただ簡単な分、全体的に青みや緑みのある明るい画面で、背景がぼけている(被写界深度が浅い)写真限定です。