HTML入門:WEBデザインに役立つツール

    • このページをはてなブックマークに追加

    公開日:2016年08月24日 最終更新日:2019年10月15日

    WEBデザイナーに限らず社外向けのホームページ作成や社内のWEBアプリケーション構築に携わるエンジニアや営業にとって画像編集や写真加工のスキルは必須と言ってもよいスキルになります。本コラムでは、WEBデザイナー向けの基本のツールから営業のプレゼンなどでちょこっとした画像を編集する際に便利なツールをご紹介します。

    1. 有料デザインツール

    1.1. Adobe Photoshop CC

    【作者名】  アドビ システムズ(株)
    【体験版のダウンロード】https://www.adobe.com/jp/products/photoshop.html
    【対応OS】Windows 7/8.1/10/Mac X v10.10/X v10.11/10.12
    【特徴】
     WEBデザイナーのみならず多くのクリエイターに利用されている定番のアプリケーションです。写真や画像加工・編集のための豊富な機能が備わっているソフトです。Webページやバナー作成はもちろん、各種画像補正機能、合成写真の作成から手描き風のイラスト作成までさまざまな用途に活用されています
    【チュートリアル】初心者向け・使用経験者向けのチュートリアルが動画で提供されています。 https://helpx.adobe.com/jp/photoshop/tutorials.html

    htmldesign1

    ▲ページトップへ戻る

    1.2. Adobe Illustrator CC

    【作者名】 アドビ システムズ(株)
    【体験版のダウンロード】https://www.adobe.com/jp/products/illustrator.html
    【対応OS】Windows 7/8.1/10 / Mac X v10.10/X v10.11/10.12
    【特徴】
     Photoshop と同様プロが活用するインラスト作成ツールの代表です。自由度の高いデザインツールを使いロゴや地図やグラフの作成などオリジナルのイラストを作成することができます。
    【チュートリアル】初心者向け・使用経験者向けのチュートリアルが動画で提供されています。 https://helpx.adobe.com/jp/illustrator/tutorials.html

    htmldesign2

    ▲ページトップへ戻る

    2. フリーのデザインツール(画像編集・イラスト作成)

    2.1. PhotoScape

    【作者名】MOOII TECH
    【作者のページからダウンロード】http://www.photoscape.org/ps/main/download.php?lc=jp
    【Vectorからダウンロード】https://www.vector.co.jp/soft/dl/winnt/art/se492136.html
    【リリース】PhotoScape 3.7(2014/09/11)
    【対応OS】Windows NT/2000/XP/Vista/7/8/10
    【特徴】
     フォトスケープ(PhotoScape)は、初心者でも簡単に写真や画像を加工・編集することができます。明るさ、カラー調整や画像のリサイズなどの基本機能の他、100種類以上のフレームや吹き出し・スタンプを使ってユニークな画像作成をすることもできます。

    htmldesign3

    ▲ページトップへ戻る

    2.2. IrfanView

    【作者名】Irfan Skiljan
    【作者のページからダウンロード】https://www.irfanview.net/
    【窓の杜からダウンロード】https://forest.watch.impress.co.jp/library/software/irfanview/
    【リリース】v4.42(2016/03/10)
    【対応OS】Windows 10/8/7/Vista/XP/Me/2000/NT/98/95
    【特徴】
     画像や写真だけでなく動画や音声も再生可能なソフトです。画像ビューワーですが、画像の拡大・縮小やトリミング、明るさ調整・赤目修正処理なども行えるので、本格的な画像加工ソフトは必要ないけれどちょっとしたフォトレタッチ用途に使いたいという場合に便利なツールです。

    htmldesign4

    ▲ページトップへ戻る

    2.3. Inkscape

    【作者名】Inkscape-Draw Freely.
    【作者のページからダウンロード】https://inkscape.org/en/
    【窓の杜からダウンロード】https://forest.watch.impress.co.jp/library/software/inkscape/
    【リリース】v0.91(2015/01/30)
    【対応OS】Windows NT/2000/XP/Vista/7/8/10 /Mac /Linux
    【特徴】
     Adobe illustratorの代替として利用できるフリーのイラスト作成ソフトです。ベクトルイメージを作成でき画像を拡大しても画質劣化のないオリジナルのイラストを作成できます。オープンソースでありながら、有料のillustratorに引けを取らないツールです。

    htmldesign6

    ▲ページトップへ戻る

    3. フリーのデザインツール(オンライン編集)

    3.1. PIXLR EDITOR

    【作者名】Autodesk, Inc.
    【オンラインURL】https://pixlr.com/editor/
    【リリース】7.1.3
    【特徴】
     「PIXLR EDITOR」は、オンラインで画像の加工・編集が可能なWEBアプリケーションです。PC上へのインストールが不要で、ブラウザーとインターネットの接続環境があれば気軽にどこでも画像を編集することができます。

    htmldesign5

    ▲ページトップへ戻る

    3.2. Background burner

    【作者名】 Bonanza.com
    【オンラインURL】https://www.bonanza.com/background_burner
    【特徴】
     「Background burner」はWEBブラウザー上で背景画像の透過処理ができるオンラインのサービスです。画像をブラウザー上にドラッグ&ドロップすると自動で透過処理を行ってくれます。うまく透過できなかった箇所は手動で修正できます。

    htmldesign10

    ▲ページトップへ戻る

    • このページをはてなブックマークに追加

    おすすめ記事

  • ピックアップ

    正社員

    【HTML】Webデザイナー|デザイン提案などのアートディレクション業務

    年収 :300万円〜700万円

    受託の開発・制作から自社開発まで幅広い案件を持ちます。 制作の視点から「こうしたら効果が上がるの...

    株式会社クオリアシステムズ

    正社員

    【Javascript】WEBデザイナー|広告/カタログの企画・デザイン・制作

    年収 :250万円〜400万円

    広告、カタログ、Web等の企画・デザイン・制作をご担当いただきます

    ワイズマトリックス株式会社

    正社員

    【Javascript】WEBデザイナー|自社Webサイトの企画・制作・運営

    年収 :400万円〜500万円

    自社Webサイトの企画・制作・運営などをご担当いただきます。 <具体的な業務> ・自社コーポレート...

    株式会社ボルテージ

    フリーランス

    【Webデザイナー/コーダー】AdobeExperienceManager(AEM)を用いたWebサイト構築

    大手企業の採用HPから有名アニメの公式HP等のデザイン/ディレクションを行うクリエイティブ企業にて、W...