フォローしませんか？
シェア
今回はFigmaを使って、文字をかっこよくカットしてみたい思います！ こちらが完成したものです。 手順📝 1、長方形を描く。 2、長方形を2枚複製。一つを120度、もう片方を-120度傾ける。 3、右クリック→Flatten (ショートカット：Ctrl+E) 4、Edit Object 5、ペンツールをクリック 6、線を3本描く。写真の赤線参照。 7、不要を選択し消す。 8、残す個所は右上のPaint backetで色を染める。 9、黄色と青色で染める。
今回はテキストのアウトライン化をご紹介します！フォントは文字情報ですが、アウトライン化するとオブジェクト(図形)情報になります。ロゴを作るときなどに便利です！ やり方📝1、テキストを書いて、選択。 2、右クリック。Outline Strokeを選択。 3、ダブルクリックをして編集。 ショートカットはこちらです。 Shift ↑＋ ⌘ ＋O Ctrl ＋Shift +O 今回はここまでです！また次の記事でお会いしましょう～😉 Resource🎨 https://
今回はFigmaのVariants(バリアンツ)を使ってみたいと思います！ 手順📝1, 好きな文字を書く。 2, shift + Aでフレームにする。 3, fillで好きな色に染める。フレームの角をとる。(今回は16) 4, Auto layout で文字をセンターに揃える。 5, フレームの名前を変える。(今回はbotton) 6, コンポーネントにする。(ctrl + Alt + K : Windoesのショートカット) 左側のアセットパネルを開くと、コンポーネン
今回はFigmaのスマートアニメを使ってスライドアニメーションを作ってみたいと思います。 1、イメージを３つ準備。 2、フレームを作成し、円を中央に置く。 3、イメージ３つを横に並べ、一番左のハンバーガーを円の上に配置。 4、フレームを複製し、今度はイメージ３つを左に平行移動しながら真ん中のドーナッツを円の上に配置。 5、さらにフレームを複製。４と同様平行移動しおすしを真ん中に配置。 6、フレームの外にあるイメージのPass throughを0％にする。 7、円
今回はfigmaを使ってローディングアニメーションを作ってみたいと思います。 手順📝 1、円をつくる。円の右にある小さい丸を押す。センター方向にドラックし輪にする。 2、円をそめる。fill、angular。 3、2枚複製し、円を90度ずつずらす。 4、プロトタイプタブでアニメーションを設定。 ■After delay, 1ms ■Smart animate, Liner, 500ms 完成🥰！ 今回はここまでです！また次の記事でお会いしましょう～😉 Foll
今回はfigmaを使ってグリッチエフェクトをやってみたいと思います。 グリッチとは、画面が壊れたときに見える画像の乱れのことです。 では早速作っていきましょう！ 手順📝 1、テキストで好きな文字を入れる 2、テキストを2つ複製 3、色を変える。上のレイヤー青0000FF、真ん中のレイヤー緑00FF00、下のレイヤー赤FF0000 4、fillの色をそれぞれexclusionにする。 5、レイヤーを少しずらし、完成🥰！ 今回はここまでです！また次の記事でお会い
今回はfigmaを使ってプログレスリングを作ってみたいと思います。 手順📝 1、円を描く。 2、Strokeにあるプラスを押す。好きな色を入れ、太さを40、位置をinsideからcenterに。fillは消す。 3、この円を複製。 4、二つの円を重ねる。右側の白い丸をクリック。 5、クリックしたまま動かす。 6、今度は真ん中の白い丸をクリック。 7、クリックしたまま外へ移動。 8、後ろの円の色を変更。20％にしました。 9、前方の円をクリック。Storok
今回はfigmaを使って３Dのモックアップを作ってみたいと思います。 手順📝 1、Vectary 3D ElementsのPluginをインストール。 2、モックアップに映したいイメージを準備。 3、イメージを選択し、先ほどインストールしたVectary 3D Elementsを開く。好きなモックアップを選択し、右下のLoad Frameをクリック。 モックアップに選択したイメージが映りました！ 4、Export Imageでエクスポート。完成です🥰 今回はここ
本日は画像の切り抜きをFigmaでやってみたいと思います！こちらの口紅を切り抜きます。 手順📝 1, 画像を置く。 2, ペンツールをクリック 3, 切り取りたいものを囲んでいきます。 4, 一周したら Done をクリック。 5, fillで染め、stroke を消す。 6, 左のパネルを確認。写真を上に、vectorを下に変える。 7, 真ん中の丸いボタン👇をクリック。 8, 完成🥰 こういったサイトを使っても切り抜きが可能です！ Follow me
本日はニューモーフィズムのバリエーション２つに挑戦してみたいと思います。 先日投稿したこちら👇からまず始めてみてくださいね。 1、くぼんだオブジェクト まずはこちらのくぼんだオブジェクトに挑戦です。 1, 前回作った正方形を複製。(右下に配置しています) 2、複製した正方形をクリックし、Drop shadow 2つをどちらも Inner shadowにする。 3, 完成！へこみました！ 2、オブジェクトを重ねる 今度はこちらのような重ねたデザインに挑戦です！
今回はFigmaで多角形を描いてみたいと思います！ 手順📝 1, 三角形を描く。 2, 三角形をクリック。 右下の count3をクリック。 3, ドラック。count4になり、四角形完成。 4, ドラックを続ける。count8で八角形完成。 完成🥰 同じ要領で星型多角形もできますよ⭐🌟✨ Follow me here😊 Youtube│Instagram│Twitter│Dribbble│Linkedin│Behance│Notion│Portfolio│F
ニューモーフィズム(Neumorphism)とはこちら👇です！ 今回もフィグマで描いていきますね～😉 手順📝 1, 四角形を描く 2, 四角形の色を背景と合わせる(今回はEBF3FF) 3、effectで１つ目のDrop shadow xを10、yを10、blurを20 色→B4C1D5 4, effectで２つ目のDrop shadow xを-10、yを-10、blurを20 色→FFFFFF 完成🥰 Follow me here😊 Website | In
