現在テストエンジニアをしていてUI/UXデザインへの幅を広げるため動画を拝見させていただいております。 実際に操作していてわからなかった部分がありますので質問させてください。 要素(<BackやHot air Ballon)を選択した際に、画面右側のDesignタブ内の表示が非活性になっており、サイズ変更などができない状態になってます。また要素を選択して移動しようとすると選択した要素以外のものも動いてしまいます(グループ化されてるイメージ)。実際にヘッダを作る部分では問題ないのですが、今後のトラブル回避のためにご教示いただけますと幸いです。
はじめましてFigmaの勉強にカイクンさんの動画を利用させていただいています。
20:45のグレーのRectangleを見えなくするという点ですが、Fillの目👁のアイコンを閉じさせるというやり方で合っていますでしょうか?
また、画面上ではAppearanceとFillをそれぞれ目のアイコンを閉じさせたときで大差が無いのですが、ほかの作業をする上でこの二つがどのように変わってくるのかご教授いただけますでしょうか。
レイヤーで非表示にすると物体そのものがなくなる判定処理になります⇒ 要素として消えたものになる
右パネルのFillなどは物質自体はある状態でその中身をいじってることになります
@@bono-oo 早速の返信ありがとうございます。あちこちいじりながらなんとかお手本通りのものを完成させることが出来そうです!
今後ともよろしくお願いします!
めちゃくちゃわかりやすいです。ありがとうございます!
ありがとうございます!
とても分かりやすい動画をありがとうございます。
アイコンを配置する所で長方形を一つ作成し、コピペしていましたがどのようにコピペできるのでしょうか?
グループ化もバナー作成ではたまたまうまく出来たのですが、今回アイコンと背景となる四角のグループ化とアイコン全部を選択する事ができず、グループ化が出来ません。
初心者の質問で恥ずかしいのですが、細かい部分を教えていだだけると助かります
解決しました。
紫の線の囲いを移動させたらグループ化出来ましたし、コピペも出来ました。
紫の線の囲いが三個位出来てるのですが、大丈夫ですか?
実物見ないと何ができてて、何ができてないか、把握できないです!
物凄く丁寧に教えて頂き感謝致します!
ブランドリソースやMaterial iconの情報なども入れて下さっていて、本っ当に最高です!
ありがとうです!
まじで勉強になります!Figmaシリーズ全部見させていただく予定です!
ありがとうございます。
あざまーす!
日本語化はどうすれば良いですか?
ネット検索からのFigmaに移動する際に、横スライドでスムーズに画面が切り替わっていますが、そこを教えて欲しいです!
↓これのことですか?これはMacbookの機能です
ruclips.net/video/LH3mTMcmVxI/видео.html
いつも楽しく動画を見ております!
動画内の操作について、1点質問がございます。
今回、ヘッダーのコンポーネントをコピー&ペーストされていますが、実際にやってみたところ、枠のみがコピーされ、なかのBackや電池残量などの要素がコピーされていない状況です。
どのようにコピーをすれば中の要素を維持した上でコピーができるのでしょうか。
今回概要欄に貼っていただいたリンク先からFigmaでコンポーネントのファイルを開くと、view onlyとなっているため、中の要素までコピーすることが出来ないようになっているのでしょうか。
初歩的なご質問になるかと思いますが、ご教示いただけますと幸いです。
ありがとうございます!
おそらく「Flame」を選択してないからだと思います!
ViewOnlyでも丸ごとコピペできます。(僕も動画内は同じです)
左のレイヤーで「# flame」というものを選択してるか確認して、コピペしてみてください!
@@bono-oo
早々にご教示いただき、ありがとうございます。
動画のように画像からFrameを選択することができなかったため、左にある各要素の一覧からFrameを選択したところ、コピー&ペーストが出来ました!
お疲れ様です!
15:30あたりからのmaterial iconについて質問です。
アイコン4つのうち、左の2つはmaterial iconの「Video Call」「Cast」を使用していると思ったのですが、用意していただいていた「Figma - ヘッダー素材」にあるicon素材とデザインが少々異なっていました。(白抜きのところが、黒塗りなっていたりします。)
こちらはsvgをダウンロードして、Illustratorで一部変更したのでしょうか?
教えていただけると助かります!よろしくお願いいたします。
足りない場合はこちらからこちらから使えるので見てみてください〜
www.figma.com/community/file/878585965681562011/Material-Design-Icons
ちなみにFigmaでもSVGは編集できます。
よろしくです!
material iconの1番上のメニュー、
「outlined」「Filled」「Rouned」「Sharp」「Two tone」で切り替えられること今気づきました…😮!
リンクありがとうございます!
svgも編集できるんですね👀!今度試してみます💪🏻
ファイトです!
自分のスマホがandroidのため、android版で作成しているのですが、android版のマテリアルアイコンが見当たりません。Googleのマテリアルアイコンとも若干違うようで、どこからダウンロードできるかが分からないのですが、教えて頂けませんか?
OSでマテリアルアイコンは変わりません。Googleのマテリアルアイコン=マテリアルアイコンだと思ってます。ので、それ以外だと僕には答えられないかなーと思います!
@@bono-oo わかりました!ありがとうございました。
丁寧で分かりやすい説明ありがとうございます!
一つ質問させていただきたいのですが、
ヘッダーをコンポーネントからコピーして自分の作業領域に貼り付けた際に、
左側のレイヤーの文字が紫色になっています。
カイクンさんのを見ると黒文字なのですが、何か違いはありますか?
どちらに設定した方が良いなどありますか?
紫
・コンポーネント化しているパーツになります
ー親が定義してあり、使いまわせる状態になってます
ー親が変わると、紫色のものはリンクしていて、全て変更できます
=> 最初は扱いづらいと思うので、その場合は右クリック「Detach Instance」で解除できます!
@@bono-oo
分かりやすい解説ありがとうございます!
現在テストエンジニアをしていてUI/UXデザインへの幅を広げるため動画を拝見させていただいております。
実際に操作していてわからなかった部分がありますので質問させてください。
要素(<BackやHot air Ballon)を選択した際に、画面右側のDesignタブ内の表示が非活性になっており、サイズ変更などができない状態になってます。また要素を選択して移動しようとすると選択した要素以外のものも動いてしまいます(グループ化されてるイメージ)。実際にヘッダを作る部分では問題ないのですが、今後のトラブル回避のためにご教示いただけますと幸いです。
1個目は紫に色になっている場合はコンポーネント化されていて、親のパーツいじらないと編集できなくなってます(パーツの共通化機能がfigmaにあります。コンポーネントで調べてみてください)
グループの解除を右クリックか、⌘/Control+Shift+Gでグループ解除してみてください
@@bono-oo
回答ありがとうございます!!Detach Instanceでコンポーネント解除したらできました。
迅速な回答ありがとうございました!!
押忍!
コメント失礼します!
とてもわかりやすく、何度も練習するべく見直しをしているのですが、一つだけうまくいかない部分があり、Material iconsを配置する際に30px×30pxの四角形を配置後、見えない様にされて、各iconたちとグループ化されたと思うのですが、その後、iconを操作しようとしても見えない様になった30pxの四角がアイコンで選ぶことができず、、カイクンの動画だと容易に指定することができる様になっていたので、なぜだろうと思っています。。(レイヤーを画像よりも上に四角をしてもできません)説明がわかりづらいかもですが、もしご回答いただける内容であればご教授いただけると幸いです、、!
正しいのかわかりませんが、見えない様にせずに、背景白にしたら選択できる様になりました!
完成ファイルと自分のものを見比べてみてくださいー!
www.figma.com/file/i0PMMa8PC2TYcjgBqtqcrD/figma%E8%AC%9B%E5%BA%A7?node-id=101%3A83
こんにちは。丁寧な解説動画ありがとうございます。
動画のようにコピーしてペーストすると、ボードが背景色の灰色に変わるだけで全くコピペできません。どうして良いか教えて欲しいです。よろしくお願いします。
どこのコピペ動作か知りたいので秒数、具体操作教えてもらえると助かります〜!
解決しました。
返事遅くなり申し訳ないです!
いつも見てます!!
質問なのですが、小さなアイコンを作る時、ピクセルごとでしか大きくならず、
また整列で全部中央にしたいのに、アイコンの周りに四角の線(パスではない)がでてきて、綺麗に並ばなかったりします、、
どうすれば綺麗に整列されますか??😭😭
>また整列で全部中央にしたいのに、アイコンの周りに四角の線(パスではない)がでてきて、綺麗に並ばなかったりします
・アイコンを置きたいブロック範囲のサイズ
と
・アイコンのそのもののサイズ
が
ピクセルが合ってないのが理由かなと思います。
伝えづらいですが!
逆に綺麗に並んでるアイコンのサイズを元にして、参考に調整してみてください!
I had fun watching this, thanks!
fyi 目次 flame -> frame :D
ありがとうございます!!(誤字も🙏
Figma vs Framer 面白かったです!
1年後とかにまた覇権変わる可能性ありそうですね〜