STUDIOを使ってみた
言いたいこと
スマホ時代になって途絶えていたGUIによるwebのオーサリング環境が久々に復活した
デザイン重視のサイトを作る際に、コーダー/コーディングと呼ばれるような手でHTMLを組んでいく芸はスマホ時代からのものだが、このツールをきっかけにまた勢力図が変わると思った 背景
長くなるのだが、「ウェブサイト」を作るのに、HTMLを手で書かなくていい時代があった
95年〜2007年の間だ
2007年はiPhone発表の年
主流だったツールは以下の通り
これらのツールは一般ユーザーだけでなく、デザインのプロにも使われていた。
スマホの登場で、モバイルサイトとPCサイトをレスポンシブに作る必要が生じて、これに対応できなかったDreamWeaverとその仲間は死滅した しかたなく手で書く必要がでてきて、コーダーという職業が誕生 （コーダーは、WordPressと同時にできた気がするので、ちょっと不正確な言い方だが）
2007〜2019は皆HTMLを手で書いている
とにかく、現在は、コーダー/コーディング作業なしでは奔放にデザインしたウェブサイトは作れなくなってしまった STUDIO
GUIでウェブサイトを作ることができる
当たり前のことだが、マージンとか、フォントサイズとか、画像のサイズとか配置とかをドラッグでひっぱりながら調整できるのは大変作りやすい
CSSの「クラス」を全部なしにして、要素ごとにスタイリングするようにしたのが思い切った味付けで、このおかげでデザインツールっぽくなっている
クラスを導入したらエンジニアっぽい発想が必要でもっと複雑になっていただろう
レスポンシビリティは、標準に組み込まれていて、スマホ、タブレット、PCの3つをいい感じに設定できる CSSのFlexboxをふんだんに使って、レスポンシブルサイトを作れるのが現代的 難しさ または ターゲットユーザー
これらを使ったことがある人なら、HTML/CSSの知識を現代にアップデートすれば慣れることができる
使ったことがない人に向けて説明すると、プレゼン作成ツールよりはもちろん難しい
このツールを覚えるというよりは、CSSについてある程度勉強する必要がある かっこいいデザインのサイトが作りたいというモチベーションを持って勉強する必要がある
誰でも簡単にほいほいという感じではない
コーディングもしたことがあるデザイナーに対して言いたいこと
普通にコーディング作業が簡単になるのでおすすめです
Scrapbox Squareというイベントのサイトを作るときに、sketchから直接HTML出力できるanimaを使ってみたけど、それよりはだいぶ筋がいい キレイなHTMLが作られる
できないこと
編集画面と出力が一致しないバグ(div内の画像サイズ)がいっかいあった
hoverとかanimationとか苦手そう？
でもモバイル時代には重要じゃない
一つの文の中で特定単語を太字にしたりリンクしたりできなさそう
これが痛い。コンテンツの種類が限られそう
CSSクラスがないので、大量にページを作っておいて、あとから全ページのサイズを変えたりするのが苦手そう
パーシャル（パーツ）機能がなさそうなので、ヘッダーを別に作っておいて、後から全ページのヘッダーを変えたりするのが苦手そう
まあでも全10ページとかならコピペできるし、それでいい
既存のHTMLは読み込めない
CMS機能はないので、ブログっぽいのには向かない（新機能として検討中のようだ）
むいているサイト
あまり規模が大きくなく、デザイン重視で、文字や写真の更新もそこそこの頻度でやりたいLanding pageには向いていると思う