🐳

STUDIOでWEBサイト作成してみた:位置調整

2023/09/09に公開

仕事でstudioを利用する機会があったので備忘録
※前回の記事はこちら

前回のおさらい

studioのテンプレートを利用してしっかりしたサイトを構築しました。
今回はテンプレートの内容をいじって自分好みにカスタマイズしていきましょう!

プロジェクトを開きます

studioにログインして前回作成したプロジェクトにマウスオーバーしてdesign editorをクリックします

文字を削除してみます

私が不要と思う文字を消してみます
※練習ですw

1.左メニューから削除したい文字のレイヤーを探して選択します

2.レイヤーを選択した状態で右メニューを開くと対象のオブジェクト情報が表示されます

3.テキスト欄の文字をクリックし、文字列をすべて削除します

4.対象レイヤーの文字が消えました

5.画面右上のライブプレビューをクリックして実際に文字が消えているか確認します

6.ちゃんと消えてました

オブジェクトを削除してみます

お問い合わせボタンが2つあるので、大きい方のボタンを消します

1.左メニューを開いて、対象のボタンのオブジェクトを探しせんたくします
選択したら右メニューを開きます

2.右メニューにある「Box」プルダウンを選択し「Boxを削除する」をクリックします

3.デザインからボタンが消えました

4.ライブプレビューでボタンが消えているか確認します

見た目変更も楽ちん!

ここまで1行もソースコードを書いていません。
テンプレートを利用しているのであまり変更を加えなくてもしっかりとしたスタイルになっていると思います
ですがオリジナル要素を入れることは重要だと思います
※UI/UXは奥が深く、私はそれっぽい言葉で逃げていますがw

振り返り

今回はオブジェクトの操作を少し触ってみました
削除だけですが今後は追加もしていきたいと思います
テンプレートで慣れてきたら1から自分で作成にもチャレンジしたいと思います

この記事が少しでも役立つ情報を提供できましたら幸いです。
読んでくださった皆様に心から感謝申し上げます

Discussion