事業をつくる
事業をのばす

当方のデフォルメ画像

デザインを
支援します

サービス設計 /
UX戦略

  • 新しいサービス、どういう機能をつくったらいい?
  • ユーザーに刺さるプロダクトがつくりたい
  • 新規サービスを立ち上げたけど、どうやって進めたら...?
あれこれこんがらがっている状況をどうにかするイメージ画像

事業の背景や経緯・現状の課題・企業としてのゴール/ユーザーゴールを整理し、ご一緒にディスカッションを深め、実現確度の高いデジタルサービスを進めるための方向性とやるべきこと・KPIなどを固めます。

ユーザーフロー設計

従来のユーザーの行動をベースに、ユーザーが無理なく利用しやすい導線を作ることで、導入ハードルを下げます。現状把握できている課題やデータを元に、提供者の理想論ベースから離れ、現実であるユーザーの目線を取り入れ、実現性の高い方向性を定めます。課題の粒度が低い場合は、課題の探索・整理からアドバイスを行います。
スライド1:Summary(ターゲットと現状、抱えている課題)
スライド2:ペルソナとバリュープロポジション(提供価値)
スライド3:カスタマージャーニー(患者)
スライド4:カスタマージャーニー(医者)
スライド5:システム設計イメージ
スライド6:事業の優位性、ユニークポイント
マッキンゼー提出資料

ユーザーリサーチ

机上の空論になりがちな、マクロデータから導いた計画や、提供者の願望を元に作った決め打ちプラン・ターゲット像、手探りにつけ加える機能開発から一歩進み、現実のユーザーの定性インサイトを明確にします。
売上、KPI、チャーンレートなどへの達成粒度を上げやすくし、無闇な試行錯誤をなくします。

また、「とりあえずシステムを作ったけど使ってくれなかった」というような、提供者とユーザーのすれ違いを防ぎ、事業価値の向上、優位性のあるポジショニング、効果的なブランディングの決定確度を高めます。

オンライン・オフラインインタビューやアンケート実施のサポート(設問作成・集計・活用)も行なっています。
リーンスタートアップのセオリーを元に、リサーチで確度を掴んだ上で、なるべくコストを抑えたプロトタイピングによるスピーディーな検証も推奨しております。
定性アンケート調査結果の実際の画像カスタマーリサーチ(実際の画像)

ワイヤーフレーム

Figma、Googleスライドにて、デザイン・開発のベースとなる骨組みを作成します。
ワイヤーフレームの事例(実際の画像)ワイヤーフレームの事例(実際の画像)

グロース

  • ユーザーはいるが、いまいち伸び悩んでいる...
  • 継続率が低い... なぜ?
  • 手探りで機能を追加しているけど、うまくいくのかな..
ユーザーのタッチポイントを観察する画像

既存ユーザーのデータと現状の運用状況をふまえ、原因を探っていきます。
ニーズ面に問題がない場合は、より訴求力を高める設計にアップデートします。

ユーザビリティ改善

Googleアナリティクスでは特定しきれない、定性的なミクロ視点から改善を行います。
サービス運営者の仮説とユーザーの実態・寄せられている期待には、ズレがあるケースがよく見られます。
運営サイドは「これぐらいわかっているだろう」「新しい機能を作ったら喜ばれるに違いない」「このサービスはすばらしいので、ユーザーも好意を持っているものだろう」という前提のもと、”だろう”運転をしがちです。
それっぽい話し合いをする様子の画像
しかし、実際にユーザーがそのように受け取れていなければ、単に離脱につながってしまうだけでなく、悪評が書き込まれ拡散されることもあります。一度ついたイメージを払拭するにもコストが発生します。
新規ユーザーを獲得できても、離脱ユーザーが多ければ、LTVは下がり、獲得広告費も無駄になってしまいます。

この状態を防ぐには、新規機能追加やマーケティング施策の前に、まずはマイナスポイントを減らし、”穴あきバケツ”の穴を塞ぐことが先決です。
穴だらけのバケツ画像
また、改善には効果が出やすいものと、それほど改善効果のないもの、改悪になるものもあります。
それはターゲットやサービスにより様々で、クラッシュやセキュリティなどの根本的な点でない限りは、一概に決まった改善点はありません。Airbnbでは写真の見栄えを良くすることが大きなグロースにつながりましたが、メルカリにはマイナスにはたらく可能性があります。

初心者向け製品であれば、複雑に網羅された機能は「使いづらい」と言われますが、玄人向けであれば、初心者にとって”使いやすい”ものが「細かいところに手が届かなくて使えない」となることもあります。
オブジェクトベースでの設計は多くの場合望ましいですが、あえてタスクベースにすることで誤ったトラブルを防ぐこともあります。
”使いやすい”は、ユーザーがやりたいことが最短距離で達成できることであり、提供者がその”やりたいこと”を自分ごととして理解していないとアプローチは難しくなり、不要なPDCAを増やします。

さらに、事業の根幹に関わってくる課題には、コアバリューが確立できていない場合が多くあります。
それは、自社サービス内だけでなく、競合サービスやユーザーを取り巻く環境も影響してきます。
その場合、部分最適化ではごく限られた効果になってしまうため、事業インパクトに強く影響を与えうる本質的なサービス価値の模索からサポートを行っています。
レビューを元に機能改善するイメージ画像

情報デザイン改善

視覚的効果訴求の不備や、内容の伝わりにくい表現を主に改善します。
ターゲットに適したテキスト・配色により視認性を確保し、コントラストやジャンプ率の調整により訴求効果を強めます。
また、適切なキーワード選定、画像・イラストでの効果的な情報伝達など、ビジュアル面を中心にブラッシュアップを行います。
実際のビフォーアフター画像1実際のビフォーアフター画像2実際の改善案(抜粋画像)

ビジュアル
デザイン

  • 今のデザインがいまいちイケてない...
  • 社内にデザイナーがいない
  • とにかく急ぎで、いい感じのプロトタイプをつくりたい
トンマナやエレメントを構成したり、コードにする様子の画像

ブランディングや開発体制、スケジュール、検証段階、ご希望のグラフィックイメージ等をお伺いしたうえで、適切なビジュアルをスピーディーに制作します。

UIデザイン

WEBデザイン

コーディング

紙面デザイン

UIデザイン

すでに方向性が固まった機能設計・ワイヤーフレームから、グラフィック面を整えます。
開発の体制・状況やビジネスサイドの優先度などを考慮し、スケーラブルなつくりを心がけています。
また、ブランディング面にも寄与できるよう、競合サービスのUIやターゲットのリテラシー等をリサーチのうえ、演出したい世界観を定義し、プロダクトの評判向上につなげます。

納品形式は基本的に、運営に関わる誰もがブラウザで簡単に・無料で共有できるFigmaにて制作しております。
コンポーネント設計についても対応しております。
Mr. Beans Coffee のUI画像コワーキング予約WEBサービスのUI画像電子カルテを患者と共有し、近くの最適な病院が見つかるサービスのプロトタイプUI画像ワンキャリア マイページデザイン

WEBデザイン

おもに静的サイト(動的処理のないコーポレートサイトやサービスサイト)のデザインを行います。
シンプル、ポップ、スタイリッシュな系統で、世界観を伝えるデザインを得意としております。

コーディングまで一貫して対応しているため、デザインのみの場合でも、コーディング時の挙動をふまえて制作することが可能です。

制作の大まかな流れは、
 ① ご希望のイメージがある場合はご共有もしくはヒアリングを元に提案させていただき、イメージをすり合わせ
 ② 載せたいコンテンツをドキュメントファイル等でいただき、実際にファーストビュー・ワイヤーフレーム(コンテンツの構成・下書き)を作成
 ③ ご確認いただき、調整後、全ページ作成
となります。
※ 複数パターンの作成や、最初にある程度完成版の作成を希望される場合は、内容・数量に応じて別途ご相談になります。
※CMSのカスタマイズデザインについては、Webflowもしくはスクラッチ構築サイトのみ対応しております。WordPressには対応しておりません。
※イラスト制作は外部イラストレーターと連携にて別途対応しております。簡易なアイコンや既存素材の利用・カスタマイズはワンストップで対応しております。
Webサイトデザイン画像(Creww Bootcamp)1Webサイトデザイン画像(Creww Bootcamp)2Webサイトデザイン画像(Creww Bootcamp)3Webサイトデザイン画像(Webflow)
ノーコードツール Webflowを使った制作
サントリー Liftage  ブランドサイトリニューアル画像MyD プラットフォームイメージ画像Tech Derby ファーストビュー画像Sasla(サスラ) ファーストビュー画像Sasla(サスラ) ファーストビュー画像 スマートフォン版レスポンシブ

スライド・パンフレット・カード・バナーデザイン

シンプルで現代的なデザインから、近未来感のあるクールなテイスト、子ども向けの親しみやすいタッチまで対応。世界観に引き込ませるデザインで、印象に残るプレゼンをサポートします。

※スライド資料に関しては、基本的にはGoogleスライドにて対応しております。
データでコーチングを行うAI・IoTテニススクール資料の表紙画像1未来感を訴求するグラフィックイメージ画像
全スライドを閲覧したい方は、お気軽にお問い合わせください。
Googleスライドで作成した、未来感を訴求するフラットな図解画像Googleスライドで作成した、図解スライド画像アンケート結果の図示画像(棒グラフ)アンケート結果の図示画像(ドーナツ型グラフ)名刺デザイン画像:モダン・スタイリッシュ名刺デザイン画像:明るいシンプル・スタイリッシュ系名刺デザイン画像:モダン・スタイリッシュバナーデザイン画像:シンプル、レトロバナーデザイン画像(スマートキャンプ様)バナーデザイン画像:フレンドリー、クリーン系(整体院サイトに掲載)

HTML/CSS コーディング

デザインをHTML、CSS、jQueryコードに起こします。

正しいマークアップは、SEOの重要な要素の一つです。
レスポンシブ・CSSフレームワーク(bulma等)・SCSSの利用にも対応しております。
動的処理を含むWEBサービスの場合は、ユーザーのアクションやデータの可変を考慮し、崩れが起きないように制御します。

デザイナーがいなくても、ちょっとした調整・変更をエンジニアのみでもできるよう、コンポーネント作成についても対応しております。(ただし、レイアウトの調整は全体的な要素のバランスによって左右されるため、ページ全体のデザイン維持をカバーするものではありません。)

※JavaScript等によるプログラミングには対応しておりません。jQueryの簡易的な調整は可能です。
コワーキング予約サービスUIのコーディング画像(コード一部)
予約一覧UI :https://core-space.net/
コワーキング予約サービスUIのコーディング画像パターン2(コード一部)
ログインパターンUI :https://core-space.net/
寄せ書きWebサービスUIのコーディング画像(コード一部)
ビジネス向け寄せ書きサービス β版 編集画面

アートディレクション

クリエイティブの方針決定や、クリエイターの管理・選定・修正から納品までの全対応を行なっております。また、複数のチームメンバーや外部クリエイターに依頼する際に、品質と方向性の統一を図るガイドラインの作成も行なっています。

最近では、Instagram等のSNSにて実用コンテンツ制作のディレクションとあわせて、投稿管理・運用もサポートしています。
外部クリエイターに依頼時の共有下書き画像例
下書き構成修正 :https://www.instagram.com/30s_reading
修正点を書き込んだ画像asana管理画面
asanaにてタスク管理
女性向け美容品パンフレットデザイン画像
女性向け美容品パンフレット冊子
その他公開が難しいものを含め、多数実績がございます。
「こういうのはできる?」等ありましたらお気軽にご相談ください。

報酬について

料金表の価格はすべて税抜きです。別途消費税がかかります。
依頼内容の性質により、予め見積もりを立てるのが難しい場合は目安とし、
完了時に過不足を清算させていただきます。
パートナー料(オンラインサポート)
有料相談(オンライン・1回)
資料作成・簡易アウトプット
訪問料
実施代行(調査・画面作成等)
月額 12万円〜
1時間 7000円
1件 10万円〜
1回 1.5万円〜
お見積もり
パートナー料(オンラインサポート)
有料相談(オンライン・1回)
資料作成・簡易アウトプット
訪問料
実施代行(調査・画面作成等)
月額 8万円〜
1時間 6000円
1件 10万円〜
1回 1.5万円〜
お見積もり
WEBサイト(内容により大きく異なります)
アプリ(内容により大きく異なります)
コーディング(内容により大きく異なります)
その他広報物等
 レスポンシブ対応
30万円〜
50万円〜
20万円〜
お見積もり
 +6〜7割

※ ご予算が限られている場合または委任型契約の場合、時間単価あたり2500〜3000円以下の制作は、同程度のクオリティーが得られるクラウドソーシングサービスの利用を推奨しております。中でもパートナーシップ・クオリティーの高いクリエイター選定・ディレクションもサポートしております。

※要件・内容確定後の変更・修正・追加は、当方の過失を除き、いかなる場合でも追加のご発注としてお見積もりをさせていただきます。 制作進行時はなるべく認識違いのないよう、こまめに確認させていただきます。

※お急ぎの場合は特急料金を30%加算させていただきます。

VOICE

クライアントアイコン画像
個人
シード段階
内容 サービス設計/UX戦略(新規WEBサービス立ち上げ)
” ターゲットユーザーの課題を深掘りしていったところ、当初想定していた構想とは異なるアプローチにはなりましたが、様々な懸念点をスピーディーに整理できました。”
クライアントアイコン画像
法人
システム開発事業
内容 サービス設計/UX戦略(新規アプリ立ち上げ)
“ メッセージベースでありながらも、サービスの本質の理解の速さ、またこちら側が素人ゆえに質問の仕方がわからない質問に対しても、ある程度想像の範囲でご回答いただける(そのうえで、こちらが聞きたかったことそのままだったり)点、非常にありがたかったです。”
クライアントアイコン画像
法人
フェムテック事業
内容 グロース(WEBサービス)
機能のミニマム化を検討し、プロダクト・収益のコアバリューから、どこを改修するべきかとユーザーへの影響を整理。
また、ターゲット市場とプロダクトの指標策定、ユーザーテストのご相談で、現状の良し悪し判断と今後の方向性をブラッシュアップ。

” この度はありがとうございました。貴重なご意見をいただけて、大変勉強になりました。分析力が素晴らしく、また別案件にてリピートしたいと思います!今後とも何卒よろしくお願いいたします。”
クライアントアイコン画像
個人
システム開発
内容 サービス設計・ビジュアルデザイン(アプリ)
“ 私はエンジニアのため、デザインスキルがあまりなく、なんとなくダサいデザインになっていました。 それをLolaさんにレビュー・実際に制作いただき、見違えるように改善しました。 ネットや本でデザインの知識を得ることはできますが、得た知識を適用することは、やってみると非常に難しいです。 非常にコストパフォーマンスが良いと思います。 今回のアドバイスを元に数日後に自分で修正した内容で再度レビューをLolaさんに頼みたいと思いました!”
クライアントアイコン画像
個人
米国公認会計士
内容 グロース(アプリ)
” アプリを出してから、3年、特にここ2年はほとんど手を入れてませんでしたが、売り上げはポツポツある状況でした。
放置せず手を入れようと思った時に、我流でやってたものを改めて業界の知識と経験のある人に知見をもらおうと思ったのがきっかけです。

やれることはたくさんある中で、次の効果的なステップが見極められずにいましたが、Lolaさんとのディスカッションの中で、1つの方向性が見えてきました。”
クライアントアイコン画像
法人
大手システム開発
内容 ビジュアルデザイン(WEBシステム)
“ 社内にエンジニアがいるため、コーディングまではお願いしませんでしたが、開発言語に合わせたCSSフレームワークを考慮してデザインの方針をアドバイスいただけました。

また、案件のビジネスサイドの都合や開発側の立場にも立ったフィードバックまでいただき、デザイナーとしての実力だけでなく、コンサルティング力も非常に高いと感じました。
この点は他のデザイナー様には無い点だと認識しています。”

支援先企業さま

crewwSmartcampHiNativeCrowdWorks
Docomo八代目儀兵衛ロゴAXISGNUS

デザインの力は、
ビジュアルだけではありません

St.Lolaでは、デジタルプロダクトにおいて、”数字をつくる”1つの軸として、ユーザーを主語に設計します。

なぜなら、事業の変数のカギを握る当事者は、提供者ではなくユーザーだからです。
”パケ買い”などはあまりないDXでは、見た目が良くても、根本的なユーザーの期待に応えていなければ、利益が十分に返ってこないか、遅くなります。

逆に、見た目が整っていない状態でもユーザーが満足していれば、そこからビジュアルを整えることで、探り探りの改善や数打ちの試行でなく、より高い確度を持って事業の伸びが期待できます。
また、そのような変数は事業の広域に関わるため、多角的な視点から最適解をコントロールする必要があります。

1点特化のスペシャリストのチームでは現状特にユーザーに求められていない点に過不足があったり、利害の不一致が起きたり、ユーザーにとっては関係のない状況が生まれることもあります。

当方では、システム開発企業でのエンジニアとの開発経験、新規事業立ち上げ経験、資金調達経験、事業売却交渉経験を活かし、包括的な視点でユーザーのベネフィットを最大化することで、事業価値や投資対効果の最大化をめざします。