| key | value |
|---|---|
| 職種 | フロントエンドエンジニア |
| 雇用形態 | 正社員 |
| 事業内容 | インターネットでの学びや教育を起点とした社会変革 |
| key | value |
|---|---|
| 職種 | フロントエンドエンジニア |
| 雇用形態 | 正社員 |
| 事業内容 | 日本最大級のクラウドソーシング「クラウドワークス」を中心としたインターネットサービスの運営 |
対応案件 詳細
組織内で不明瞭になっているものや技術的負債をコントローラブルなものにするため、現在ある技術的負債を理解し解消をリードしていく目的のチームです。 現在あるフロントエンド開発を整理し、バックエンドとの分離と正式にフロントエンド基盤を確立させるミッションに取り組んでいます。
チーム構成
開発者4人, チーム責任者1人（開発部長兼任）
実施したこと
- フロントエンド開発に関する開発指針やロードマップの策定
- 2021/10~2022/02 にかけて使用されている Vue.js の v2 から v3 への移行を完了
関連：Vue 2 からVue 3 に移行完了しました！ - クラウドワークス エンジニアブログ - Rails テンプレートエンジンから Vue.js への移行作業を開始
Vue3 環境を活かし<script setup>で記述 - markuplint ルールを拡充して堅牢な HTML マークアップをできるように整備
- Webpacker から webpack + Simpacker 環境への移行（記事）
- Vue3 環境下での Storybook バージョンアップ（記事）
- 他チームのVue.js開発における不明点のフォローや疑問点の解消を行う
これまでのフロントエンドにおける活動をエンジニアブログにて発信をするよう心がけております。
- crowdworks.jp のフロントエンド活動を振り返る2023 - クラウドワークス エンジニアブログ
- crowdworks.jp のフロントエンド活動を振り返る 2022 - クラウドワークス エンジニアブログ
- crowdworks.jp のフロントエンド活動を振り返る 2021 #フロントエンド - Qiita
- クラウドワークスのフロントエンド活動を振り返る 2020 - クラウドワークス エンジニアブログ
勉強会・カンファレンスへの参加やスポンサー協賛を通じて弊社のフロントエンド開発と社外との関係構築も行っております。
- Vue Fes Japan Online 2022 参加レポート - クラウドワークス エンジニアブログ
- GAAD Japan 2022 でスポンサー協賛と LT をしてきました - クラウドワークス エンジニアブログ
- 当事者不在でも変化してきたクラウドワークスのフロントエンド開発について - Google スライド
- Vue Fes Japan 2023 参加レポート - クラウドワークス エンジニアブログ
ユーザの発注を促進するため課題解決と施策の実施、新機能の開発を目的としたチームです。
チーム構成
開発者6人（フロントエンド2人, バックエンド4人）, デザイナー1人, プロダクトオーナー1人
実施したこと
- Rails API, Vue.js, Storybook を用いた新機能開発
バックエンドとフロントエンドの作業分離による効率化目的 - チーム内レビューを通じてフロントエンド開発が不慣れな人への知識取得を促す
チーム内成果
カンタン発注プラン診断診断機能の開発しました。
2021年上期（2020/9~2021/3）に実施した施策において全社MVPを受賞しました。
自社プロダクトに関連するフロントエンドに関連する業務を行うチームです。
主にマーケティングに関連する業務を遂行しつつ、フロントエンドにまつわる課題やアクセシビリティ改善なども率先して行いました。
チーム構成
マネージャ1名、プロダクトオーナー1名、フロントエンドエンジニア（2名）、デザイナー（2名）のチーム
実施したこと（マーケティング領域）
プロダクトへの検索流入や新規会員登録数を高める目的として、SEOやランディングページ作成を行いました。
主な作業として、PCとモバイルでの表示コンテンツ差分を解消するためのMobile First Index対応や、構造化マークアップを data-vocabulary.org から schema.org へ更新するなどを行いました。
施策検証のためにA/BテストのためのGoogle Optimize導入し、その結果に基づいたページ、UI改修を行いました。
ランディングページの作成や更新も担当しておりました。これまでランディングページを手動更新していたところをGitHubリポジトリへ移行し履歴が残るようにしつつGitHub Actionsを用いて本番環境への反映を自動化するよう効率化を行いました。
実施したこと（フロントエンド関連）
ページ表示速度が課題となっていたためそれにまつわる改善を行っておりました。
GASとWebPageTestを用いたパフォーマンス観測をしつつ、ブロッキングレンダリングの軽減するためのCSS、JSの容量削減対応をしました。
上記JSの容量削減に付随し、プロダクト内で使用されているjQuery Pluginを調査し不要なものの剪定対応し容量軽減やエンジニアの認知負荷を軽減させる取り組みを実施しました。
社内での安心安全宣言の取り組みで、お仕事の報酬金額の表示を分かりやすくするため、Vue.jsを用いたUI実装を担当しました。リアクティブに入力値が計算され結果が反映されるようにし、WAI-ARIAを用いて支援技術にも認識できる誰もが使えるUIを実装しました。
実施したこと（アクセシビリティ関連）
コーポレートサイトリニューアルに伴い、コーポレートサイトのアクセシビリティチェックを行いました。リリースまで時間がなかったため、WCAGの原則における「知覚可能」のレベルA項目をチェックし、制作チームへのレビューを行いました。
社外でのアクセシビリティチェック活動の経験を活かし、プロダクトのアクセシビリティチェックを行いました。WCAG2.1でのレベルA、一部レベルAAの対応確認をして、GitHub Projectでチェック結果を見える化するようにして時間を作ってそれらの対応を行いました。
ユーザーからのフィードバックを受けてデザイナーと協業し、PC版「仕事の詳細」「メッセージ」の文字サイズを変更、読みやすくなるように対応しました。
関連：PC版「仕事の詳細」「メッセージ」の文字サイズを変更し、読みやすくなりました | クラウドワークス お知らせブログ
| key | value |
|---|---|
| 職種 | フロントエンドエンジニア |
| 雇用形態 | 業務委託 |
| 事業内容 | 出版社・講談社のウェブメディア、デジタルコンテンツの開発 |
対応詳細
- SEOのためのマークアップ改善提案・修正対応
- Storybook ファイル作成
- API 通信処理に関するリファクタリング作業
- Senrty エラーログを元にした修正
- デザイントークン設定に関する Style Dictionary の調査
| key | value |
|---|---|
| 職種 | フロントエンドエンジニア |
| 雇用形態 | 業務委託 |
| 事業内容 | クラウドファンディングサービス「READYFOR (レディフォー)」の運営 |
対応詳細
- デザインシステムを用いたUIコンポーネントの開発
- UIコンポーネントのアクセシビリティ改善
| key | value |
|---|---|
| 職種 | デザインエンジニア・アクセシビリティエヴァンジェリスト |
| 雇用形態 | 正社員 |
| 事業内容 | CX（顧客体験）プラットフォームKARTEの開発・提供 |
| key | value |
|---|---|
| 職種 | マークアップ・フロントエンドエンジニア |
| 雇用形態 | 正社員 |
| 事業内容 | Webフロントエンド開発・自社サービス開発 |
- Webディレクター 6名
- Webデザイナー 3名
- マークアップ・フロントエンドエンジニア 6名（本人）
- EC＆事務担当 2名
主に受託開発やリニューアル・サイト制作をメインとして、マークアップ・フロントエンド業務に携わる。
- W3C Markup Validation Serviceなどを通してHTMLの品質遵守を常に心がける
- レスポンシブ、アダプティブの各デザインにおける最適なマークアップ
- AtomicDesignにおけるパーツ単位からのUIデザインへの理解
- 更新・保守関連の対応やプロジェクトwikiまとめなどの品質維持・情報共有に関して徹底
- パフォーマンス改善・向上案件への参加
- 最新の業界ニュース共有、社内勉強会ほか業務改善案などにも積極的に提案
対応案件 詳細
- https://www.geek.co.jp/recruit/
- gulp, pug, postCSS, stylelint, webpack, jQuery, Google Maps
- ES6, validatorjs, webpack4, WAI-ARIA, CSS Grid Layout
- pug, sass, webpack, CakePHP
- 静的実装、アクセシビリティ対応、Webパフォーマンス調整
- Vue, axios, owl.carousel, video.js, Masonry, imagesloaded, lity, intersection-observer
- React, TypeScript, gulp, webpack, less, Storybook
- wp-rest-api, Vue.js, vue-router, vue-paginate, axios
- React, Redux, stylus, ES6
- React, creat-react-app, Redux Form
- 一部ページリニューアルでVueを導入
- Vue.js, vue-carousel, axios
- WordPress, jQuery, VanillaJS, babel, intersection-observer
- JS Plugin - Masonry, Velocity
- CakePHP, jQuery, CSS3
- HTML5, CSS3, jQuery
- 特集ページ新規テンプレート作成
- 番組APIを利用したAjax通信
| key | value |
|---|---|
| 職種 | ディレクション・デザイナー・エンジニア |
| 雇用形態 | 正社員 |
| 事業内容 | Webサイト制作・CMS運用業務 |
- Webディレクター4名（本人）
- Webデザイナー・コーダー 3名
- サーバーエンジニア 4名
詳細
クライアント向けWebサイト（主に大学・教育系）の更新業務から提案・デザインおよびHTMLコーディング業務を経験し、 制作後の運用指導や迅速なサポートなどクライアントとのやり取り、一連の作業経験を積むことができた。- 東京電機大学
- 順天堂大学スポーツ健康科学部
- 城西大学
- 明治大学付属中野中学・高等学校
- 千葉経済大学
- キヤノンビズアテンダ株式会社
- 三井不動産住宅リース株式会社
| key | value |
|---|---|
| 職種 | Webコンテンツ編集 |
| 雇用形態 | 派遣社員 |
派遣先：株式会社エイト・ソーシャルウェア
詳細
アプリ形式のゲームやコミックなどをダウンロードできるモバイル電子出版サイトのコンテンツ制作・運営。- メインサイト制作
- 特集ページ制作
- キャンペーンページ制作
- コンテンツ企画、提案
- コンテンツ管理表作成
- 更新マニュアル作成