OKM

### 人材マッチング事業 フロント〜UIUX改善 デザイナー育成 事業： HR Techサービス開発 担当： FEエンジニア/UIUXデザイナー 目的： UIUXチーム開発&フロント改善 技術： Rails/Docker/CircleCI/Jest WSL2/Linux/webpack/ESlint/Prettier React/Hooks/ES6/SCSS/CSS Module StoryBook/Figma/Slack/ClickUp/ GitHub/JIRA/DocBase デザイナー向けのFigmaデザインガイド設計 エンジニア向けのデザインシステム設計 **主課題**： デザイン設計〜フロント実装領域まで横断的に見るフロント設計、UIUX改善を軸としたフロント実装。デザインチームの実装知見のアップデート。 **成果物**： Figmaでの汎用デザインガイドの作成、ReactのUIパターンと連動したFigmaコンポーネント作成とチーム浸透。 UI連動したReact Storybook設計とRails連動基盤作成。CSS in JSの提案。汎用CSSのリファクタリング。プロダクト全体のUIUX改善とフロント実装。 チームビルド用のカンバン運用再設計・提案実現

医療系のB2C新規サービスの立ち上げを行いました。 ゼロイチから開始し、１年でローンチするスピード感のあるフロントエンド業務を行いました。 規模感から億単位の投資を行うプロダクトでしたが、フロントエンドは私1人で、所属元の開発チームとUIUX専門の企業との中間位置に立ち、UIUXの課題解決と実装上の課題を解決するハブとなりローンチまで持っていく事を実現しました。 Ruby on Railsベースでのフロントエンド設計は環境構築の時点で工夫が必要ですが、アセットパイプラインの特性を生かしながら、Vue.jsも含めてのUIコンポーネント設計にコミットしました。 最終的にユーザーが操作するUIのデザイン設計も、レスポンシブ設計や文脈ごとのグルーピングなど、細部にまで気を使って設計、実装しました。 結果的にグッドデザイン賞を受賞させていただきました。

## 20万人が会員のオンライン教育プラットフォームの開発1。動画学習コンテンツのコンバージョンアップ施策やUI設計を担当。 使用技術にあるフロントエンド手法を用いて汎用的なコード・スタイルガイド作成、UI設計を行う。 一番得意とするところはレスポンシブ設計/実装で、レスポンシブ対応UI改修や読み込みスピード改善、ソーシャルログイン対応などによってコンバージョンも2倍以上にあがりました。 解析はヒートマップのCrazy Egg、Google Analyticsを使いました。 リアルの対人ユーザーテストなども行いました。 また、社内レギュレーション改修も積極的に行いまた。 --- **担当**： UIUXデザイナー/FEエンジニア **目的**： コンテンツの顧客増員、体験向上 **技術**： OpenEdx/Python/AWS/JavaScript/HTML5/CSS3/Foundation/Sass/SMACSS/レスポンシブ設計、企画提案 **主課題**： サービス初のUIデザイナーとして参画。明確な数値的成果、会員獲得の導線設計。 **成果物**： Googleアナリティクス/ヒートマップ等でユーザー属性の分析と可視化。PageSpeed Insights 等でパフォーマンススコアを最下点から改善。CSSの総改修。画像容量制限等レギュレーション制定。 社内コミュニケーション改善 Slack導入レギュレーション。会員18万人 -> 30万人越獲得。

メガベンチャー企業にて、ソーシャルゲームの開発、運用を行いました。 テスターとデザイナー、プロダクトマネージャーと連動し、厳密なスケジュールの元、以下に最短距離で開発を行うかを常に心がけました。 QA専門チームからあがってくるUIUXレビューに対して、どのように実装を行えばユーザビリティが向上するかを設計し、フロントエンドレギュレーションにも沿いながら実装していきました。 また、スマホだけでなくガラケーも対応していたため、Docomo/SoftBank/au用のコードの書き分けや、ドキュメントの無い中での課題解決なども良い成長機会となりました。 開発チームと施策チームが一心同体となり、コード実装だけでなく、どうやればユーザーが課金し楽しんでもらえるかを常に考えて開発をしていました。 朝一のMTGでは必ず全員で集まり、先日のユーザー推移を課金の状況を共有し、その原因を特定してから一日の業務を始めました。 根拠無き手入れは行わないようにし、あくまでユーザーが数字で答えを出す、という姿勢は一貫して持つようにしていました。