見出し画像

STUDIOでのウェブサイトの作成と、写真の撮影

はい、こんにちは。上田です。今回は、和菓子プロジェクトの進捗具合について話をしていきたいと思います。ちゃんとやってました。サボってないよ。


前回の投稿からの変更点、進捗具合をまとめると、

figumaでのワイヤーフレームの作成が完了
・BASEでのECサイトの作成からSTUDIOでの作成に変更
写真撮影が完了
各商品の説明文を作成中

という感じ。まあ結構進んだんじゃないでしょうか。今回はこれらの進んだことをひとつずつ説明していきたいと思います

figumaでのワイヤーフレームの作成が完了

まず、figumaでのワイヤーフレームの作成が終わりました。最初は操作に慣れず苦戦していましたが、どんどん慣れてきて手際よく進めることができました。正直結構めんどくさかったけど。

BASEでのECサイトの作成からSTUDIOでの作成に変更

次に先日、(といっても結構前だけど)BASEでECサイトの作成をする、といったのですが、それを「STUDIO」に変更したいと思っています。(URL貼っておきますね。)
https://studio.design/ja

画像1

スマホならこんな画面が見えます。

で、変更したのはなぜかっていうと、BASEだと僕がfigumaで作ったワイヤーフレームのデザインを再現することができないからです。
BASEは購入までの流れは超簡単で、だれでもすぐにECサイトが作ることができますが、その分デザインの設定も簡略化されていて、正直あまり自由度は高くありません。まあ、自分でHTMLとCSSでコーディングできる機能もあるんですが、HTMLとCSSを使えるようになるのにも時間がかかるし、作るのにも時間かかるし、断念しました。

じゃあ、皆さんがなんだそりゃと思った、「STUDIO」について話をしていきましょう。

これを姉に教えてもらう前の僕は、PROGATEっていうプログラミングの動画教材でHTMLとCSSを学んでいましたが、覚えることの多さに絶望していました。
「この調子じゃウェブサイト完成するの大学卒業後になってまうで…。」
ですがSTUDIOを知って、こんな僕でもウェブサイトを一人でも作れるようになっていました!(なんかSTUDIOのまわしもんみたいになった。)
STUDIOというのは超簡単に言うと、

プログラミングのコードを一切使わずにWEBサイトが作れちゃうサイト

です!!
「うおおおおおお!!!こんなものがあるなら早く教えてくれよ!!」
ていう声がたくさん聞こえてきますね。
まあこれのおかげで僕はプログラミングを全く理解しないままになってしまったんですけど。そんなことは置いといて。
サイトを開いてからの手順を紹介させてもらうと、

①自分のアカウントを作る
②チュートリアル動画を見て操作方法を理解する。(結構カジュアルに教えてくれる)
③実際にウェブサイトを作る

全くプログラミングの知識がなくても、チュートリアル動画を見ればある程度使いこなすことができます。とはいえ、操作の基本の概念としてはHTMLとCSSと同じであるので、ある程度その辺の知識があると入ってきやすいのかな。
あともうちょっとSTUDIOの説明をしておくと、STUDIOの基本的な操作や、STUDIOで作ったサイトのリリースは無料で行うことができますが、月額900円払えれば、追加コンテンツを使用できるようになります。こんな感じ↓。

画像2

ということもあり、僕らの和菓子プロジェクトは、STUDIOでのウェブサイトの作成を行っていくことになりました。
といっても、BASEの購入までの流れはすごく魅力的ではあるので、基本のウェブサイトの作りはSTUDIOで行いますが、購入フォームなどはBASEのものを埋め込んでいこうと思います。にしても、世の中には便利なものがたくさんあるんだなあ。

写真撮影が完了

次に、先日、松栄軒に訪問させていただきました。そこで、商品の写真撮影と、各商品の説明文を作るために、いとことヒアリングをしました。あと、ちびっ子と戯れました。

あ、写真撮影は僕がしたわけではありません。友達に写真を撮るのがうまい人を紹介してもらって、その方々に撮ってもらいました!
正直最初は、写真うまいといってもどうせ学生だろうと思っていましたが(なんて失礼)、ロケットランチャーみたいなカメラを持ったガチの人が来てくれてビビり喜びしました。
写真なんて、スマホで鼻くそほじりながらでしか撮ってこなかった僕には想像できないくらい、一つ一つの写真に力を入れてくれました。
ここの角度はもっとこうしたほうがいいとか、光源の位置がどうたらこうたらとかめっちゃ話し合ってくれてて、最後僕にこの写真でいいか、確認とってくれますが、僕はなんもわからないので、「う、うん!いんじゃない!?」くらいしか言えませんでした。これからも写真は人任せで行こうと思います!

画像3

僕が撮ったやつ。天気が悪い。

各商品の説明文を作成中

また、いとことのヒアリングで、商品のネタがたくさんとれたので、しっかりと、心を込めて、商品説明文を書いていきたいと思います。
あと、サイトを作っていくうちにすごく感じることは、
「文章の内容、こんなんでええんやろうか…」
てこと。まあそれはこのnoteでも一緒なんですけど。というわけで、ウェブライティングの本を購入しました。

これ学んで、ウェブライティングのハウツーを学んでます。非常にわかりやすく説明してくれるのでこれからブログやろうかなとか、なんか文章書こうとしている人にお勧め。

まとめ

というわけで、今回は和菓子プロジェクトの進捗具合、変更点について話をしました。こんな感じで順調に進んでいるので、皆さん期待しておいてほしいと思います!

ではまた!

この記事が参加している募集

この記事が気に入ったらサポートをしてみませんか?