AYAME Inc.は、STUDIOのPROランクエキスパートです。本記事では、エキスパートになるためにどんな取り組みをしたのか、どのようなプロセスでスキル習得をしたのかを振り返ります。これからエキスパートを目指したい方の参考になれば幸いです。STUDIO Expertsとは?STUDIO独自の審査やカリキュラムに合格した制作会社・ユニット・フリーランスデザイナーが加盟する制度です。STUDIOを使ったWEBサイト制作スキルはもちろん、クリエイティブのレベルやノウハウ、コミュニケーション能力、ビジネスに対する姿勢なども審査対象になっています。ランク制度も導入されており、上位ランクであるほどSTUDIOの制作・導入経験が豊富なエキスパートとなります。なぜSTUDIO Expertsを目指したのか?①権威性が欲しかったWEBデザイナーという職業は、必要な資格や最低経験年数の縛りがありません。SNSを見ると、未経験から3ヶ月でWEBデザイナーになれると謳うスクールも多く見かけます。名乗った瞬間から肩書を持ててしまうこの職業に、わたしは10年の年月を捧げています。現場で叩き上げられ、独立をして、会社を設立し、この仕事で生きていくことに腹をくくっています。だからこそ、これまで培ってきた制作のスキルやデザイン力を対外的にアピールできるバッジが欲しかったことが最初の理由です。②営業活動に活かしたかった起業してから最初の1年間、新規の依頼は0件でした。会社員時代からツテのある取引先や知人の紹介などが主なクライアントで、クラウドソーシングのプラットフォームに登録しても、鳴かず飛ばずの状態が続いていました。STUDIO自体が話題に上がることも多く、ノーコード技術の可能性が注目されている中で業界の追い風に乗ることができれば、見込み客へのリーチもしやすくなるのではと考えました。③挑戦したかったSTUDIO Experts、かっこよくないですか?強そうじゃないですか??自分もなりたい!という憧れが一歩目の熱源でした。これまでのキャリアを誰かに肯定してもらいたいという願望でもあったと思います。思った以上に加入条件が厳しい加入にはSTUDIOが定める一定の条件があり、一次審査の書類審査と二次審査の面談をクリアする必要があります。そもそも一次審査に応募するためには加入条件があり、わたしの場合はこれらを満たすのに1年かかっています。%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Fexperts.studio.design%2F%22%20%20target%3D%22_blank%22%20style%3D%22color%3A%20%23777%3B%22%3ESTUDIO%20Experts%3C%2Fa%3E%3C%2Fp%3E第一関門:STUDIO Showcase掲載実績1件以上まず、STUDIO Showcaseという申請方式のWEBサイトギャラリーに、自身の実績が1件以上掲載されていないといけません。掲載には審査が行われます。審査はサイト内容とデザインクオリティの両面に関して行われますが、具体的な基準は公開されていません。つまり、ただSTUDIOでの制作実績があるだけではなく、審査をクリアしてSTUDIO Showcaseに掲載されなければ条件を満たすことができません。第二関門:自社Webサイトの登録が必須STUDIO Expertsの応募フォームには「自社WebサイトURL」の登録が必要です。自社サイトの制作が後回しになるのは業界あるあるで、わたしも例に漏れず、独立しているというのにコーポレートサイトやポートフォリオサイトを持っていませんでした。第三関門:一定数の学習コストがかかるノーコードとはいえ、STUDIOは専門性の高いツールです。STUDIOでできること・できないことの仕様を理解するまでは、実現が可能なデザインかどうかをひとつひとつ検証しなければなりませんでした。STUDIOに限らず、新しいツールを使いこなすための必要な時間投資でもありますが、片手間で習得できるほど、甘くはありませんでした。STUDIO Experts就任までのロードマップ様々なハードルはありましたが、晴れて目標にしていたSTUDIO Expertsに就任することができました。ここからは具体的にどんな行動したのか、ロードマップとしてそのステップを紹介します。①情報収集公式が出している情報を網羅するまずはSTUDIOが用意しているレッスン動画や、ブログ記事、ガイドなどの文献をくまなくインプットしました。0ベースで情報を仕入れる感覚で、すでに理解している内容も飛ばさずにとにかくオフィシャルの情報に触れてみるということをやりました。%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Fcommunity-ja.studio.design%2Fcourses%22%20%20target%3D%22_blank%22%20style%3D%22color%3A%20%23777%3B%22%3E%E5%85%AC%E5%BC%8F%E3%83%AC%E3%83%83%E3%82%B9%E3%83%B3%E5%8B%95%E7%94%BB%3C%2Fa%3E%3C%2Fp%3E人に聞く分からないところはヘルプの有人チャットに問い合わせたり、STUDIO Communityに質問するなどして手探りで解決方法を探しました。大体のことはCommunityを見れば解決できます。当時のポンコツ具合が分かる質問のやりとりが残っていましたので載せておきます。%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Fcommunity-ja.studio.design%2Fc%2Fothers%2F404-c4176b%22%20%20target%3D%22_blank%22%20style%3D%22color%3A%20%23777%3B%22%3E%E7%A7%92%E3%81%A7%E8%A7%A3%E6%B1%BA%E3%81%97%E3%81%9F%E5%AE%9F%E9%9A%9B%E3%81%AE%E8%B3%AA%E5%95%8F%E3%82%B9%E3%83%AC%E3%83%83%E3%83%89%3C%2Fa%3E%3C%2Fp%3EウェビナーやMeetupに参加する他にもSTUDIO活用方法についてのウェビナーや、STUDIO Communityが主催するオンラインMeetupなど積極的に参加しました。この時期にMeetupで知り合ったデザイナーの方々とは今でも情報交換をしたり、仕事の相談をしたりと良い関係が築けています。%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Ftokyofreelance.connpass.com%2Fevent%2F265567%2F%22%20%20target%3D%22_blank%22%20style%3D%22color%3A%20%23777%3B%22%3E%E5%AE%9F%E9%9A%9B%E3%81%AB%E5%8F%82%E5%8A%A0%E3%81%97%E3%81%9F%E3%82%A6%E3%82%A7%E3%83%93%E3%83%8A%E3%83%BC%3C%2Fa%3E%3C%2Fp%3E②自主制作を行うデザイナーの筋トレだと思って、STUDIOでのサイト制作に慣れるために自主制作を行いました。スクラッチ制作と同じフローでデザインを起こし、実装フェーズで忠実にデザインを再現するよう取り組みました。試行錯誤すれば実現できないデザインはほとんどなく、逆にSTUDIOで実現できないデザインは「そもそも表現として最適なデザインなのか?」という視点を授けてくれる良い機会となりました。💡個人的にはテンプレートをさわるよりも、「空白からはじめる」をおすすめします。最初はレイヤー構造など、出来上がったものを見ても何がどうなっているのか分からないため、ハードルに感じてしまう場合があります。空白からテンプレートデザインを模写するか、photoshopやFigmaで作ったオリジナルデザインを実装するのが良いと思います。③コーポレートサイト・ポートフォリオを作成ある程度STUDIOにも慣れたところで、自社のコーポレートサイト制作と自身のプロフィール、ポートフォリオを制作しました。これが一番時間をかけたプロセスです。当時は仕事もなく暇だったので、毎日12-16時間くらいをこの制作に充てていました。💡プロフィールは、これまでどんなことに取り組んできたのか、それを踏まえてどんなことが提供できるのかを言語化し、人となりが分かる信頼材料となるように意識して作りました。またポートフォリオは一覧で成果物が分かるように、意図的に多くを語らず実績だけを連ねる仕様にしています。④クライアントワークにSTUDIOを導入自主制作3サイトと自社サイトの計4サイトを制作したことで、ノーコードに対する懸念も払拭でき、初めてクライアントワークでSTUDIOを使用しました。多少なりとも不安はあったものの、スムーズに納品まで完遂することができました。%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Flightup-denki.studio.site%2F%22%20%20target%3D%22_blank%22%20style%3D%22color%3A%20%23777%3B%22%3E%E3%81%AF%E3%81%98%E3%82%81%E3%81%A6STUDIO%E3%81%A7%E5%88%B6%E4%BD%9C%E3%81%97%E3%81%9F%E3%82%AF%E3%83%A9%E3%82%A4%E3%82%A2%E3%83%B3%E3%83%88%E3%83%AF%E3%83%BC%E3%82%AF%3C%2Fa%3E%3C%2Fp%3E⑤STUDIO Showcaseに申請自主制作以外のWebサイトを、Showcaseに掲載申請してみました。申請したサイトのクオリティには自信があったのですが、1件目も2件目も音沙汰がなく、3件目に申請した軒先花屋のサイトでようやく掲載されることが許されました。Showcaseに1件でも実績が登録されると、STUDIOに登録のアカウント名でShowcase内にプロフィールページが作られます。%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Fshowcase.studio.design%2Fja%2Fcreator%2FabM6LRNX%22%20%20target%3D%22_blank%22%20style%3D%22color%3A%20%23777%3B%22%3EAYAME%20Inc.%E3%81%AEShowcase%E3%83%97%E3%83%AD%E3%83%95%E3%82%A3%E3%83%BC%E3%83%AB%E3%83%9A%E3%83%BC%E3%82%B8%3C%2Fa%3E%3C%2Fp%3E💡通過しなかったサイトを見直してみると、altの未入力やタグの構造化が設定出来ていなかったり、OGP周りのページ別設定が出来ていなかったり、hoverアクションを付けていなかったりと、デザインよりも実装の不足が目立ちました。おそらくこのあたりが条件クリアに満たなかったのだと自己分析しています。⑥テンプレートデザイナーに応募テンプレートデザイナーとは、STUDIOで制作したデザインを販売することができるデザイナーを指します。こちらも完全審査制で、通過したデザイナーのみがSTUDIO Storeにて有料テンプレートの販売権利を獲得できます。Showcase掲載の最終目的はSTUDIO Expertsへ応募するためですが、応募フォームの入力項目がわりとヘビーだったこともあり、入力項目が比較的ライトなテンプレートデザイナーへの応募を先に行いました。これまでの成果がようやく実り始め、テンプレートデザイナーの審査は一発で通過することができました。%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3E%E9%80%9A%E9%81%8E%E3%81%99%E3%82%8B%E3%81%A8%E3%81%93%E3%81%AE%E3%82%88%E3%81%86%E3%81%AA%E3%83%A1%E3%83%BC%E3%83%AB%E3%81%8C%E5%B1%8A%E3%81%8D%E3%81%BE%E3%81%99%3C%2Fp%3ESTUDIO Expertsに就任加入条件が揃ったところでいざ応募!と思った矢先、大変光栄なことにSTUDIO側から直接お声がけいただくことができました。Showcaseの実績掲載およびテンプレートデザイナーの審査通過によって、存在を見つけていただけたのだと思います。願ってもないオファーだったので、二つ返事で応募させていただき、晴れて念願のエキスパートとなりました。%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Fexperts.studio.design%2Fexperts%2Fayame-inc%22%20%20target%3D%22_blank%22%20style%3D%22color%3A%20%23777%3B%22%3EAYAME%20Inc.%E3%81%AESTUDIO%20Experts%E3%83%97%E3%83%AD%E3%83%95%E3%82%A3%E3%83%BC%E3%83%AB%E3%83%9A%E3%83%BC%E3%82%B8%3C%2Fa%3E%3C%2Fp%3Eここまでの時系列2022年10月:STUDIOにアカウント登録2023年10月:はじめてShowcaseに掲載2023年11月:テンプレートデザイナー審査通過2023年12月:エキスパート就任エキスパートになるための最短ルート個人的には、Showcaseへの掲載が最も手応えを感じました。掲載審査もかなりレベルが高いので、エキスパートを目指さないにしてもShowcaseへの掲載はマストです。Showcaseへ掲載されることにより、多くの方の目に留まる機会が増え、STUDIO以外の実績紹介媒体にも取り上げていただけました。%3Cdiv%20style%3D%22display%3A%20flex%3B%20justify-content%3A%20center%3B%22%3E%3Cblockquote%20class%3D%22twitter-tweet%22%3E%3Cp%20lang%3D%22ja%22%20dir%3D%22ltr%22%3E%E3%82%A2%E3%82%A4%E3%83%87%E3%82%A2%E3%82%92%E5%88%BA%E6%BF%80%E3%81%99%E3%82%8B%E3%80%81%E3%81%BF%E3%82%93%E3%81%AA%E3%81%AE%E6%9C%80%E6%96%B0Web%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B336%E9%81%B8%E3%80%902024%E5%B9%B44%E6%9C%88%E7%89%88%E3%80%91%20-%20%3Ca%20href%3D%22https%3A%2F%2Ft.co%2FsZAbePrlYn%22%3Ehttps%3A%2F%2Ft.co%2FsZAbePrlYn%3C%2Fa%3E%20%3Ca%20href%3D%22https%3A%2F%2Ft.co%2Fz13w65ulfY%22%3Epic.twitter.com%2Fz13w65ulfY%3C%2Fa%3E%3C%2Fp%3E%26mdash%3B%20Photoshop%20VIP%20(%40photoshopvip)%20%3Ca%20href%3D%22https%3A%2F%2Ftwitter.com%2Fphotoshopvip%2Fstatus%2F1785279113181487214%3Fref_src%3Dtwsrc%255Etfw%22%3EApril%2030%2C%202024%3C%2Fa%3E%3C%2Fblockquote%3E%20%3Cscript%20async%20src%3D%22https%3A%2F%2Fplatform.twitter.com%2Fwidgets.js%22%20charset%3D%22utf-8%22%3E%3C%2Fscript%3E%3C%2Fdiv%3E%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Fphotoshopvip.net%2F157344%22%20%20target%3D%22_blank%22%20style%3D%22color%3A%20%23777%3B%22%3EPhotoshop%20VIP%E3%81%AB%E5%8F%96%E3%82%8A%E4%B8%8A%E3%81%92%E3%81%A6%E3%81%84%E3%81%9F%E3%81%A0%E3%81%84%E3%81%9F%E3%80%8E%E3%82%B5%E3%83%B3%E3%83%88%E3%83%AA%E3%83%BC%E3%83%8B%20%E3%83%9B%E3%83%86%E3%83%AB%20%EF%BC%86%20%E3%83%B4%E3%82%A3%E3%83%A9%E3%82%BA%20%E5%AE%AE%E5%8F%A4%E5%B3%B6%E3%80%8F%3C%2Fa%3E%3C%2Fp%3Eまとめ先日参加したオンラインイベント「STUDIO夏祭り」で、「STUDIOによって翼を授けてもらった」と話しました。大げさな誇張表現ではなく、大真面目に飛べる手段を手に入れたと思っています。それはSTUDIO Expertsに加盟する前から思っていたことで、ノーコードはコーディングができないデザイナーの生きる道だと感じています。%3Cdiv%20style%3D%22display%3A%20flex%3B%20justify-content%3A%20center%3B%22%3E%3Cblockquote%20class%3D%22twitter-tweet%22%3E%3Cp%20lang%3D%22ja%22%20dir%3D%22ltr%22%3E%E7%9B%AE%E6%A8%99%E3%81%AB%E3%81%97%E3%81%A6%E3%81%9FSTUDIO%E5%85%AC%E8%AA%8D%E3%83%91%E3%83%BC%E3%83%88%E3%83%8A%E3%83%BC%E3%81%AB%E3%81%AA%E3%82%8C%E3%81%BE%E3%81%97%E3%81%9F%EF%BC%81%3Cbr%3E%E3%80%8C%E3%83%8E%E3%83%BC%E3%82%B3%E3%83%BC%E3%83%89%E3%81%A7%E3%83%87%E3%82%B6%E3%82%A4%E3%83%8A%E3%83%BC%E3%81%AF%E3%81%93%E3%81%93%E3%81%BE%E3%81%A7%E3%82%84%E3%82%8C%E3%82%8B%E3%80%8D%E3%82%92%E4%BD%93%E7%8F%BE%E3%81%97%E3%81%9F%E3%81%84%E3%80%82%E9%A0%91%E5%BC%B5%E3%82%8A%E3%81%BE%E3%81%99%EF%BC%81%3Ca%20href%3D%22https%3A%2F%2Ft.co%2F58tTKpXkLS%22%3Ehttps%3A%2F%2Ft.co%2F58tTKpXkLS%3C%2Fa%3E%3C%2Fp%3E%26mdash%3B%20%E5%B1%B1%E7%95%91%20%E7%BE%8E%E5%A5%88%EF%BD%9CAYAME%20Inc.%20(%40minayamahata)%20%3Ca%20href%3D%22https%3A%2F%2Ftwitter.com%2Fminayamahata%2Fstatus%2F1741344966818025563%3Fref_src%3Dtwsrc%255Etfw%22%3EDecember%2031%2C%202023%3C%2Fa%3E%3C%2Fblockquote%3E%20%3Cscript%20async%20src%3D%22https%3A%2F%2Fplatform.twitter.com%2Fwidgets.js%22%20charset%3D%22utf-8%22%3E%3C%2Fscript%3E%3C%2Fdiv%3Eだいぶ長くなってしまったので、STUDIO Expertsに加盟して何が変わったのかという話は別の機会にさせていただきます。ここまでお付き合いいただき、ありがとうございました。告知最後に告知だけさせてください。わたしがSTUDIOメンターとして参加しているオンラインスクールNOT DESIGN SCHOOLで「STUDIOマスター講座」が販売されました🎉%3Cp%20style%3D%22font-size%3A%2012px%3B%20font-family%3A%20var(--s-font-50befc71)%3B%20color%3A%20%23777%3B%20text-align%3A%20center%3B%22%3ENOT%20DESIGN%20SCHOOL%E3%81%AE%3Ca%20href%3D%22https%3A%2F%2Fnotdesignschool.jp%2Fcourse%2Fstudio%22%20%20target%3D%22_blank%22%20style%3D%22color%3A%20%23777%3B%22%3ESTUDIO%E3%83%9E%E3%82%B9%E3%82%BF%E3%83%BC%E8%AC%9B%E5%BA%A7%3C%2Fa%3E%3C%2Fp%3Eこの講座の何がすごいのか、、それは現役でSTUDIOをバリバリ使いこなしているつよつよのWEBデザイナーたちが集結してカリキュラムを作っているということ。僭越ながらわたしもその中のひとりに入れていただいております。普段はコーチングやメンターを行っておりませんが、このSTUDIOマスター講座の中だけ限定的にメンターセッションを受け付けております。わたし以外のエキスパートメンバーともセッション可能ですので、ご興味ある方はぜひご検討ください。