タグ

ブックマーク / photoshopvip.net (80)

  • 【2023年ベスト】無料で使えるすごい神AIツール27個まとめ

    AIツールはビジネスやクリエイティブなど、あらゆる分野で活用され、業務効率化や生産性向上に貢献しています。 2023年は、コストをかけずにAIを最大限に活用できる無料AIツールが、たくさん登場した年となりました。 この記事では、無料で利用できるAIツール28個をご紹介します。 チャットボット、テキストエディティング、画像生成音楽生成、音声生成など、さまざまなカテゴリのツールを厳選しています。

    【2023年ベスト】無料で使えるすごい神AIツール27個まとめ
  • 便利で差がつく、ずるいWeb制作ツール・素材90選【2023年ベスト】

    2023年も終わりに近づき、この1年間に収集したツールを振り返りながら、Web制作に役立つお気に入りを見つけてみましょう。 素晴らしい新ツールや素材がたくさんリリースされ、選定にはたっぷり時間がかかりましたが、カテゴリ別に幅広くセレクションできました。 当に役立つかどうかだけを考え、「これ、神ツール。」と思えるものをピックアップ。 話題の的だったAIをうまく活用すれば、ワークフローを格段にスピードアップさせ、面倒な作業もストレスなくこなすことができます。 この記事では、そんなあなたの役に立つ2023年公開のWebデザイン制作ツールや素材をまとめてご紹介します。 整理したカテゴリは以下の通り。

    便利で差がつく、ずるいWeb制作ツール・素材90選【2023年ベスト】
  • 全て無料、本当は教えたくないフリーフォント無敵リスト【商用OK】

    全て無料、当は教えたくないフリーフォント無敵リスト【商用OK】 商用利用OK、日語や英語、スタイル別にまとめた完全ガイド この記事では、無料ダウンロードできるフリーフォントを、カテゴリやスタイル別にご紹介。 「フォントを探すときに、どこを見たらいいか分からない」 備忘録として活用できる、フリーフォント一覧ガイド集。 人気の高い記事を中心に、定期的にアップデートしています。 コンテンツ目次 好きに選べる、好きなだけ使えるAdobe Fonts ✨ すべてのCCユーザーが対象で、すべてのフォントが使い放題 おすすめフリーフォント ✨ 漢字も使える、オススメ日語フリーフォントまとめ ✨ 手書きでナチュラルな無料フォント ✨ 筆記体フリーフォント11年分をまとめた秘密リスト Adobe フォント ✨ Adobe Fonts オススメ日フォント35選 ✨ Adobe Font オススメ英語

    全て無料、本当は教えたくないフリーフォント無敵リスト【商用OK】
  • Web制作のお供に!最新オンライン時短ツール32個まとめ

    Web制作のお供に!最新オンライン時短ツール32個まとめ これから使いたい、あまり知られていない便利ツールが大集合 Web制作の効率化を図りたいというひとにオススメしたい、最新オンライン時短ツールをまとめてご紹介します。 「もっと早く知りたかった」と思ってしまう、便利なツールを中心に、クリエイターの日々のデザイン業務を軽減してくれる、目からウロコな素材やツールが揃います。 カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. デザインツール 2. Webデザイン便利ツール 3. モックアップ・UIツール 4. アイコンツール 5. クリエイティブ・面白ツール Web制作の効率、生産性アップ!話題の最新オンラインツールまとめ デザインツール Womp 3D 立体感たっぷりな3Dデザインを、ブラウザ上で直感的に作成できる、新世代のオンラインツー

    Web制作のお供に!最新オンライン時短ツール32個まとめ
  • 【フォトショップ】写真から何でも削除できる、怖すぎる新AIツールをつかった魔法テク

    もしも、フォトショップをつかって、写真から不要な人やものを消したいとき、あなたならどうしますか。 さまざまな方法がありますが、もっとも手軽なのが「コンテンツに応じた塗りつぶし」でしょう。 シンプルな写真では問題ないのですが、特に複雑な写真では、フォトショップにあまり良い結果を期待することができません。 今回は、フォトショップと無料のAIツールをつかって、どんな写真でも不要な人やものを消す新しい写真加工テクニックをご紹介します。 フォトショップ「コンテンツに応じた塗りつぶし」の現状 まずは、フォトショップの「コンテンツに応じた塗りつぶし」をつかって、どこまで消せるか試してみます。 こちらの写真の手前に立っている男性を、消してみましょう。 加工をはじめる前に、もとの写真をコピーして保存しておくと、もしものときのバックアップになります。 ここでは、「被写体の選択」ツールを使い、人物のみを切り抜き

    【フォトショップ】写真から何でも削除できる、怖すぎる新AIツールをつかった魔法テク
  • 流行先取り 注目の最新Webデザインおすすめ30選まとめ

    「デザインのアイデアがなかなか見つからない」 「Webデザインの最新トレンドを知りたい」 「かっこいいデザインの見サンプルが欲しい」 そんなときに目を通したい、旬のトレンドを取り入れた最新おすすめWebデザイン30選をご紹介。 国内外のウェブギャラリーでも取り上げられている、世界中からセレクトされたホームページやWebサイトばかり。 レイアウトや配色、フォントえらびなど、実用的なアイデアに困ったときに役立ちます。 流行先取り 注目の最新おすすめWebデザインまとめ 隅田川道中 ページ全体に広がる波紋エフェクトにはじまり、 和楽器集団による演奏など、一度見たら忘れなそうなサイト。コンテンツに進むにつれ音量がさがり、最後のフッターでふたたび最高潮に。 ノースマン公式サイト エレガントなフォント使い、 重なりのある自由なレイアウトなど、どれもサイト制作の参考になりそうな仕掛けがたくさん。 Ha

    流行先取り 注目の最新Webデザインおすすめ30選まとめ
  • 【CSS】「これどうやる?」アップルやテスラのWebレイアウト再現テクニック集

    AppleやNike、Teslaといった誰もが知る大企業のWebレイアウトを、CSSで再現するテクニック集がTwitterで投稿され、話題となっています。 CSSのみで表現できる目からウロコのテクニックが中心で、あの驚くようなエフェクトも実はシンプルな数行のコードで表現されていたりします。 コピペできるCSSコードと一緒に、デモサンプルも確認してみましょう。CSSで解決できるテクニック、増えています。 「これどうやる?」アップルやナイキなど大企業Webサイトで利用中のレイアウト再現CSSテクニック集 ノーコードでレスポンシブなデザインを構築できる Builder.io のCEO @Steve8708は、有名サイトで使われている魅力的なレイアウトが、どのように作成されているのか、コピー用のサンプルコードと一緒にみじかい動画で詳しく紹介しています。 ユーザーの視線を奪うアニメーションやレイアウ

    【CSS】「これどうやる?」アップルやテスラのWebレイアウト再現テクニック集
  • コピペ一発!便利なCSSレイアウト生成ツールおすすめ12選(Grid & Flexbox編)

    あなたが、いま実装しようとしているレイアウトは、おそらくCSSで実現できるでしょう。 ただし日常の業務をこなしながら、日々進化するCSSの最新テクニックを習得するとなれば、話はまったく別です。 仕事で使えるCSS技術を、時間をかけて学ぶよりも、ボタンやドラッグ&ドロップ操作で、思い通りのレイアウトを自動で生成できる「ジェネレーター(英: Generator)」を活用してみましょう。 新しいプロジェクトにコピー&ペーストで利用でき、瞬時に思い通りのレイアウトを作成、はじめてのひとにもオススメの時短ツールを厳選しています。 コピペ一発!便利なCSSレイアウトジェネレーターおすすめ12選(Grid & Flexbox編) ここでは、CSS Grid と Flexbox で表現できるレイアウト用ジェネレーターと便利なリソースを一緒にまとめてご紹介します。 Layoutit! grid-templ

    コピペ一発!便利なCSSレイアウト生成ツールおすすめ12選(Grid & Flexbox編)
  • 本当は教えたくないWebデザイン参考ギャラリーサイト37選

    ウェブサイト制作には、常に新しいアイデアやインスピレーションが必要ですが、決まらずに悩んでしまうことも。 そんな状況を打開するには、たくさんの優れたデザインの実例を見ることで、次のアイデアを生み出してみましょう。 ここでは、最新ウェブデザインをいち早くチェックできるオススメWebギャラリーサイトを厳選してご紹介。 インスピレーションとしてはもちろん、クライアントの打ち合わせやイメージの共有にも活用できます。 積極的にインプットを増やし、デザインの引き出しを増やしてみましょう。 このリストは2年ぶりにまとめ直したアップグレード版となります。 コンテンツ目次 【2024追加分】最新Webギャラリーサイト landing.love Design Spells Godly BentoGrids 404s Footer Navbar Gallery 国内Webギャラリーサイト SANKOU! URA

    本当は教えたくないWebデザイン参考ギャラリーサイト37選
  • よくあるWeb課題をCSSで乗り切る!知っておきたい最新テクニック20選

    この記事では、日頃のホームページ制作で直面しがちな問題をCSSで乗り切る最新テクニック20個をまとめてご紹介します。 早く知っておけばよかったと思う、あまり知られていないCSSの実用的なテクニックが中心で、実際の問題ケースや参考サンプル用ソースコードを一緒に確認できます。 前回のお役立ちCSSテクニック集と合わせて確認してみてはいかがでしょう。 よくあるWeb制作の悩みをCSSで解決!最新テクニック40選まとめ コンテンツ目次 1. 画像の質感をアップしたい 2. グラスモーフィズム効果を表現したい 3. 入力フォームの使いやすさを改善したい 4. CSS Transformをつかった最新テクニック 5. 2022年に知っておきたい新しいCSSプロパティ 6. position: stickyの正しい使い方 7. レスポンシブ対応の区切り線のつくり方 8. するするとカーテンが降りてくるエ

    よくあるWeb課題をCSSで乗り切る!知っておきたい最新テクニック20選
  • 2021年にCodepenで話題!コピペ可なHTMLスニペット ベスト100発表

    HTMLなどのコードをブラウザ上で確認ができ、公開や共有もできるなど、世界中のデベロッパーが愛用するCodepen。 この記事は、2021年に特に人気の高かったHTMLスニペットをランキング形式でまとめた The Most Hearted of 2021 が発表されていたので、その中でも実用性の高いHTMLスニペットを中心にまとめて紹介しています。 CSSのみで表現されたお手軽なHTMLスニペットから、Three.jsをつかったインタラクティブな動きやアニメーションにも注目が集まっています。 HTML/CSSやJSなどのコードの確認や編集を行うことができるので、今後のデザイン制作に活用してみてはいかがでしょう。 2021年にCodepenで話題!コピペ可なHTMLスニペット ベスト100発表 97位 Metallic Bordered Text with CSS Photoshopで作成し

    2021年にCodepenで話題!コピペ可なHTMLスニペット ベスト100発表
  • Web制作を変える!2021年の便利オンラインツール・ベスト100選

    この記事では、2021年に公開された便利なWebオンラインツール・ベスト100個+をまとめてご紹介します。 定期的にリストアップしている最新オンラインツールまとめ記事では、2021年にかけて合計338個の新しいツールやサービスを紹介してきました。 その中でも、特にWebデザイン制作に便利なツールを選りすぐったコレクションで、「無料で利用できるツール」を揃えています。 これらのツールやサービスを活用すれば、Webデザイン制作をより快適に進めることができるでしょう。 カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. CSSツール(11個) 2. パターンツール(3個) 3. イラスト系ツール(9個) 4. デザインツール(17個) 5. 配色ツール(7個) 6. グラデーションツール(12個) 7. SVGツール(9個) 8. スクリーンシ

    Web制作を変える!2021年の便利オンラインツール・ベスト100選
  • わずかな時間で驚くほどWeb制作がはかどる最新オンラインツール43個まとめ

    この記事では、Webデザイン制作を楽にする最新オンラインツール43個をまとめてご紹介します。 コピペで利用できるお手軽CSSツールやSVGツール、コード知識不要のノーコードツール、色に困ったときに便利な配色ツールなど、クリエイティブな案件で活用したい新しいツールを揃えています。 自分のワークフローにうまくツールを導入することで、制作時間の短縮につながるだけでなく、ストレス少なく作業を行うことができます。 カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. Web制作便利ツール 2. 配色ツール 3. デザインコレクション 4. プロトタイプ、アイコンツール 5. コラボ、リモートワークツール 6. 面白、クリエイティブツール Web制作の効率、生産性アップ!話題の最新オンラインツールまとめ Web制作便利ツール Layout Patter

    わずかな時間で驚くほどWeb制作がはかどる最新オンラインツール43個まとめ
  • Web制作あるある「画像ない問題」を解決!ダミー画像の生成サービス15選

    「準備はまだできていないけど、仮のダミー画像を入れておきたい」ウェブ制作中にそんな場面に遭遇することもあるでしょう。 この記事では、ダミー画像を手軽に生成できるジェネレーター、オンラインツールをまとめてご紹介します。 そもそもダミー画像とは? ウェブ制作中に、「画像の準備はできていないけど、とりあえずレイアウトの確認だけでもしたい」、というときに利用する仮の画像、これが「ダミー画像」です。 画像のサイズはもちろん、スタイルなどもimgタグに直接記述するだけで、ダミー画像を表示できます。 試しに以下のようにimgタグを記述してみると、 <img src="https://placehold.jp/272343/ffd803/640x400.png"> ほんの少しの指定を行うだけで、サイトの雰囲気にあった色合いのダミー画像を用意することができます。サイズ指定も手軽なので、お気に入りのダミー画像

    Web制作あるある「画像ない問題」を解決!ダミー画像の生成サービス15選
  • 時短してますか?Web制作が変わる最新オンラインツール38個まとめ

    日頃の忙しい業務を少しでも楽にしたい、効率化したいと考えている人にぴったりな、Web制作で使える最新オンラインツールをまとめてご紹介します。 コピペで利用できるお手軽CSSツールやSVGツール、コード知識不要のノーコードツール、色に困ったときに便利な配色ツールなど、クリエイティブな案件で活用したい新しいツールを揃えています。 カテゴリごとに整理しているので、制作フローに新しく追加してみてはいかがでしょう。 コンテンツ目次 1. Web制作便利ツール 2. 配色ツール 3. デザインコレクション 4. プロトタイプ、アイコンツール 5. コラボ、リモートワークツール 6. 面白、クリエイティブツール Web制作の効率、生産性アップ!話題の最新オンラインツールまとめ Web制作便利ツール クリックで一発コピペできる、120種類以上のCSSボタンを集めたライブラリ。3Dやグラデーション、レトロな

    時短してますか?Web制作が変わる最新オンラインツール38個まとめ
  • Webデザインの種明かし、コピペできる最新HTML/CSSスニペット30個まとめ

    この記事では、Webデザインの引き出しを増やす、コピペで使える最新HTMLCSSスニペットをまとめてご紹介します。 Codepenで話題となっているものを中心に、今後のデザイン制作に活用したいアイデアがずらり揃った今回。新しいウェブデザインの可能性を感じるものばかりとなっています。 Webの進化が止まらない、コピペ可な最新HTMLスニペット40個まとめ CSSコピペで完成!押したくなるWebボタンデザインまとめ Webデザインの引き出しを増やす、コピペできる最新HTMlCSSスニペットまとめ 「Run Pen」をクリックすることで読み込みが開始されます。右下に表示された「Return」で再読み込みし、左上のHTML/CSS/JSタブを切り替えることで、それぞれのスタイリングを確認できます。実際にカスタマイズしたいときは、右上の「Edit on Codepen」をクリックしましょう。 画

    Webデザインの種明かし、コピペできる最新HTML/CSSスニペット30個まとめ
  • CSSコピペで完成!押したくなるWebボタンデザインまとめ

    この記事では、ウェブサイトを訪れたひとが思わず押したくなるボタンデザインをまとめてご紹介します。どのボタンをHTMLCSSのみで作成されているので、手軽にコピペで利用でき、カスタマイズも自由自在となっています。 JSもつかったよりクリエイティブなボタンエフェクトもあるので、プロジェクトに合ったボタンデザインを探してみましょう。 ボタンをデザインするときに気をつけたいポイントをチェックしておけば、より効果的なボタンの使い方ができますよ。有名サイトのボタンをコピペできるサービスもおすすめです。 現在37種類のボタンデザインが揃い、今後も定期的にアップデートしていきます。 CSSコピペで完成!押したくなるWebボタンデザインまとめ ユラユラと揺れる波ウェーブボタン まるで水面が揺れているようなエフェクトが特長のボタンエフェクト。 See the Pen Creative Wave Button

    CSSコピペで完成!押したくなるWebボタンデザインまとめ
  • 無料で商用OK!筆記体フリーフォント12年分をまとめた秘密リスト

    「筆記体でかわいい、おしゃれなデザインにしたい」と思っても、いざ文字を入力してみると、「なんか思ってたのと違う」と感じたことはないでしょうか。 お気に入りのフォントをやっと見つけたら、個人利用のみだった、なんて経験も。 10年以上に渡り、コツコツと集めてきたフォントのなかから、商用利用ができる無料の筆記体フリーフォントのみを厳選してご紹介。 デザインに苦手意識があるひとも、文字を入力するだけでおしゃれに仕上げるオススメ&定番の筆記体フリーフォントで、デザイン作業を快適にしてみませんか。 一覧リストには、現在84個の筆記体フリーフォントが揃い、今後もアップデート予定です。 好きに選べる、好きなだけ使えるAdobe Fonts 「海外サイトからのフォントのダウンロードは不安。」 「できるだけ低予算で、高品質なフォントを、安心して使いたい。」 そんなときは、20,000以上のプロフォント、500

    無料で商用OK!筆記体フリーフォント12年分をまとめた秘密リスト
  • 面倒なWeb制作におさらば!便利すぎる新登場オンラインツール48個まとめ

    Web制作のたびに繰り返し手こずって、時間のかかってしまう作業ってないでしょうか。 作業の効率化や時短において、限界を感じているひとにこそ刺さる、知っておきたい最新オンラインツールをまとめてご紹介します。 面倒な作業もあっという間に終わるだけでなく、どれも無料で利用でき、これまでのWeb制作がガラリと変わるコード不要の「ノーコード」Webページビルダーや、AI技術を活用したサービスも続々増えています。 「Web制作をもっと手早く終わらせたい」と考えているひとは、まずは自分だけのお気に入りツールを見つけてみましょう。 コンテンツ目次 1. Web制作便利ツール 2. 配色ツール 3. デザインコレクション 4. イラスト系ライブラリ 5. プロトタイプツール 6. アイコンツール 7. コラボ、リモートワークツール 8. 面白、クリエイティブツール 面倒なWeb制作におさらば!便利すぎる新登

    面倒なWeb制作におさらば!便利すぎる新登場オンラインツール48個まとめ
  • Webデザイン制作をもっと楽に!便利な最新オンラインツール45個まとめ

    この記事では、Webデザイン制作をもっと楽にする最新オンラインツール45個をまとめてご紹介します。 ウェブデザインに限らず、グラフィックなどあらゆるクリエイティブな案件、プロジェクトで活躍しそうな新しいツールを中心に揃えています。 これまで面倒だった作業をワンクリックで完了したり、人工知能が自動で行ってくれたりと、より快適にプロジェクトを進めることができる便利ツールが揃います。 自分のワークフローにうまくツールを導入することで、制作時間の短縮につながるだけでなく、ストレス少なく作業を行うことができます。 カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. Web制作便利ツール 2. 配色ツール 3. デザインコレクション 4. イラスト系ライブラリ 5. プロトタイプツール 6. アイコンツール 7. コラボ、リモートワークツール 8.

    Webデザイン制作をもっと楽に!便利な最新オンラインツール45個まとめ