最新記事

Webデザインに絶対に役立つツール5選

web デザインを制作する際、デザインや構成に悩まれた経験を一度はされた人は多いのではないでしょうか。そこで今回はWeb デザインを作る際に役立つツールを紹介してます。

1.oto255

http://0to255.com/

利用料金:無料

カラーを選択したい際に便利な、カラーチャートツールです。コード表をみて微調整をしたり、少し色を変更するためだけにPhotoshopを起動して色を変更する手間を省くことができます。カラーを選択するだけで、明るい色から濃い色までのカラーコードが表示されますので、色の微調整などを行う際に活用できて便利です。

パソコンにインストールしているフォントを、ブラウザ上で一覧表示してくれるツールです。「Load more」をクリックすると、すべてのフォントが読み込まれます。スクロールしているだけでフォントを見比べることができますので、フォントを選択する際に非常に便利です。複数のフォントを比較する際は、フィルタリング機能を使うことをオススメします。英語対応のサービスですが、テキストは日本語入力できますので、単語や文章などを画面上部中央のボックスに入力して最適なフォント選択に活用してください。

2.wordmark.it

http://wordmark.it/

利用料金:無料

パソコンにインストールしているフォントを、ブラウザ上で一覧表示してくれるツールです。「Load more」をクリックすると、すべてのフォントが読み込まれます。スクロールしているだけでフォントを見比べることができますので、フォントを選択する際に非常に便利です。
複数のフォントを比較する際は、フィルタリング機能を使うことをオススメします。英語対応のサービスですが、テキストは日本語入力できますので、単語や文章などを画面上部中央のボックスに入力して最適なフォント選択に活用してください。

利用料金無料

3.Cocoapotrace

http://www.geocities.jp/applescriptdepot/iWeb/AppleScriptDepot/

画像をドラッグ&ドロップするだけで、モノクロのベクター画像へ変換してくれるサービスです。変換した画像を画面左側の枠にドロップすると、右側のボックスに変換後のプレビューが表示されます。プレビューがあまり気に入らなかった場合は、枠下の各パラメーターの値を調節して。
アップデートボタンをクリックすると、プレビューが更新されます。カラー情報は吐きされてしまうので、使用の際は少し注意が必要です。

利用料金:無料

4.webflow

 

https://webflow.com/

利用料金:$84〜/月、無料トライアルあり

短時間で高いクオリティのホームページを作成することができるサービスです。特に、デザインは得意だけれどプログラミングが苦手というデザイナーの方にオススメです。直感的にデザインをすることができ、作成したものはファイル出力またはホームページとして公開することができます。より細かい微調整を行う場合は個別のプログラミング編集が必要になりますが、ほとんどの作業をこのサービスで完了させることができます。

5.Google Web Designer

http://www.google.co.jp/webdesigner/

利用料金:無料

ウェブコンテンツを簡単に作成できるサービスです。グラフィックツールとタイムラインでアニメーションを作成すると、プラットフォームを問わずに動くHTML5、CSS3、JavaScriptを出力してくれます。直感的に操作できますので、誰でも簡単に使用することができます。
このツールを使用すれば、Flashを使用しなくてもアニメーションバナーなどを作成することができますので、今後より必要となってくるツールです。

今回は、Web デザインに役立つツールを紹介させて頂きました。是非参考にして頂いたら幸いです。

 





Tominaga Jun

プログラマー、デザイナー、写真家、ライター
として、九州を拠点に活動をしています。このサイトはデザインとパソコンに強くなるメディアとして立ち上げましたので利用してください。又、近状やコンテンツはFacebook.twitterで発信もしていますのでお気軽にFollowしてください。

http://www.facebook.com/tominagajun1

関連記事

  1. 2017年再注目されているグラデーションWebデザイン

  2. 目移りする可愛いウェブデザイン7選

  3. Webデザインの参考にしたい国内のクリエーターポートフォリオ[まとめ]

  4. デザイナーやクリエーター向けにおすすめするワードプレステーマ[まとめ]

  5. 海外のオリジナリティー溢れるウェブサイト6選

  6. 海外のトップクリエーターのポートフォリオ8選

  7. オリジナリティー溢れる!海外写真家のポートフォリオ10選

  8. 行動心理学から見る人を引きつけるホームページの作り方

PAGE TOP