design

figmaのオートレイアウト機能の使い方を解説している記事です。作り方を画像を用いて徹底的に説明しているので、オートレイアウトの基本が学べます。figmaが初心者の方も概要や使い方を覚えておくと作業効率やエンジニアとのコミュニケーションに役立ちます。

figma初心者だった25歳現役webデザイナーがfigmaのスタイル機能の考え方と使い方を解説します。「スタイルとは」の基本を実際の画面キャプチャを使い丁寧に説明しているので、webデザインを勉強中の方におすすめの記事です。

figmaのコンポーネントの作り方や、概念を徹底的に解説します。インスタンスの説明や、命名規則などコンポーネントの管理方法も詳細に記載しているので、チームでの作成を目指している方にもおすすめの記事です。

figmaのマスク機能を使用して画像を作成する方法をご紹介します。基本の使い方を覚えたら、応用することでバナーやアイコン制作の幅が広がるのでこの記事でマスクの使い方をマスターしましょう。マスクのやり方がわからない初心者の方は必見です。

現役WEBデザイナーが学習を始めた時から2年以上使用しているVSコードのおすすめプラグインをご紹介します。プラグインはVSコード内でインストールできるので、とても簡単に便利な機能をつけることができます。作業効率を上げて綺麗なコーディングをしましょう。

フォトショップを使用して足を伸ばす簡単な方法をご紹介します。SNSにアップする写真を上手に撮影できなかったときはささっと編集して、素敵な自分を残しましょう。

swiperのオプションを駆使して横スライドと縦スライドの自動スライドを作り、逆再生をループさせる方法を説明します。メインビジュアルの仕様にぴったりです。コピペで実装できるので、コーディング勉強中の方も参考にしていただける記事です。

CSSのclip-pathで画像やテキストを横から出すアニメーションの作り方を説明します。コードのサンプルも記載しているので、コピペで実装可能です。SVGアニメーションなしで実装できます。WEBデザイン勉強中の方や、コーディングで困っている方は必見です。

Mac Book proの買い替えをした時に迷ったことや考えたことを説明します。proとairの違いを知りたい方や、webデザイン、コーディング、プログラミングを勉強中の方、これからMac Bookを購入しようとしている方の参考になる記事です。

デザイン初学者向け！画像加工で度々出てくる、作りたい画像サイズと素材が合わない問題を解決します。フォトショップの便利機能を使って上手に塗り足し、画像を伸ばして、作業効率化しましょう。