y4shiro

自己推薦一覧

自己推薦はありません

3年後の目標や野望


技術力を向上させ、エンジニアとしての軸を固める

将来的な目標は価値あるプロダクトの開発だが、 その目標を達成するために技術力を更に向上させたい。 主に伸ばしたい・興味のある領域はフロントエンド、ネイティブアプリ。 - Vue.js - React.js - Swift - Kotlin

年収評価シート

2017年/半年以内

生放送サービスのコメント監視支援ツール開発 (Web 版)

# 概要 グループ会社の生放送サービスにてコメントを投稿する機能があり、 弊社ではコメント監視業務を請け負っている。 監視作業は手作業で行う工程が多い・監視対象が重複している事がある、といった問題を抱えていた。 そこで、監視業務の効率化を目的として Web アプリケーションの企画・設計・コーディング・テスト・運用/保守を行った。 # 問題 コメント監視業務では以下の問題があった。 サービスが軌道に乗るにつれ、チャンネル数と監視人員が増加していたため問題が深刻化していた。 - 監視チャンネルが複数ある場合、ウィンドウを都度手動で並べる作業が発生している - 複数の監視者が現在どのチャンネルを担当しているかわからず、監視対象が重複している場合がある # 開発環境・技術 このプロジェクトでは下記技術を採用。 ## フロントエンド - Vue.js 2.4 - Vuex - Matelial Design Lite - ESlint ## バックエンド - Ruby on Rails 5.1 - Webpacker - ActionCable ## インフラ - AWS EC2 - AWS RDS (MySQL) - AWS ElastiCache(Redis) - AWS ALB ## その他 - GitHub - CircleCI フロントに関しては、初めてモダンな JavaScript を触るにあたり学習コストが比較的低い Vue.js を採用。 バックエンド・インフラに関しては、開発部門で主流な環境のため、上司や同僚からのアドバイスを受けやすいため採用した。 Rspec でテスト、GitHub で PR・レビュー、CircleCI でテストとデプロイを行った。 # 実装 Rails の View 側実装は下記の通り - ユーザ認証画面(sorcery gem) - 監視画面 - 管理画面(ユーザとチャンネル) ## 複数チャンネルをウィンドウ一枚にまとめて表示 こちらに関しては、監視画面に複数チャンネルを同時に表示出来るアプリケーションを実装した。 具体的には、 1. チャンネルリストコンポーネント 2. 動画コンポーネント を作成し、チャンネルリストから監視対象の追加・削除を行うもの。 追加・削除を行うたびにブラウザサイズに応じて調整を行うため、 従来発生していた手動作業が不要になった。 また、コメント監視に最適な比率でアスペクト比を維持できるよう実装した。 ## 監視状況の可視化 監視対象の重複に関しては、コメント数が多い番組は複数人数で監視に当たる場合もあるため、 監視状況を可視化して全員が把握できる機能を実装した。 先に実装したチャンネルリストに監視者の名前を表示するもので、 Rails 5 から実装された ActionCable を使用した。 ロードバランサは AWS ELB を使用していたが、Websocket との相性が悪かったため、 AWS ALB へ変更し Websocket 通信が行えるよう修正した。 監視者名が表示されるまでのレスポンスが 30~40 ms 程度なので、 ほぼリアルタイムで監視状況を把握することが出来るようになった。 # 結果 いずれも初めて触った技術であったが、オンスケで開発・リリースまでを行うことが出来きた。 効率化に関しては、手動作業の省略化・監視対象の可視化によってカバー率の向上を達成。 監視業務にかかる工数の削減に貢献することが出来た。

2017年/1年以内

生放送サービスのコメント監視支援ツール開発 (アプリケーション版)

# 概要 先のプロジェクトで開発したコメント監視支援ツール (Web 版)だが、 サービス自体の仕様変更があったため、アーキテクチャ含めて再設計/開発を行った。 Web 版の機能に加え、事業部側からの追加要望を実現するためアジャイルで開発を行った。 一部機能はサービス側エンジニアの協力が必要不可欠であったため、 Slack やビデオチャットなどで綿密な連携を図り、無事機能を実装することが出来た。 Web 版と比較し、 - 最大監視数の増加 - NG ワードハイライト - Windows7 環境での絵文字表示 など、更に作業効率を改善し監視コストの削減に貢献した。 # 問題・要望 - 生放送サービスが仕様変更し、Web 版では動画再生が不可能になった - 一度に監視できる動画の最大数を増やしてほしい - NG ワードが投稿された場合にハイライトされる機能が欲しい - 監視画面から直接コメントの削除・悪質ユーザの BAN を行う機能が欲しい - Windows 7 環境だと表示できない絵文字があるので、表示させて欲しい - コメント欄の表示を監視業務向けにカスタマイズして欲しい # 開発環境・技術 アプリケーション版のベースに Electron を採用した。 採用理由は下記の通り。 - Web 版で実装した機能やコンポーネントを流用できる - 生放送サービスの仕様変更に追随しやすく、CORS の設定を回避できる - Win/Mac 両方の環境で使用できる ## フロントエンド - Electron - Vue.js - Vuex - Vuetify (CSS フレームワーク) ## バックエンド - Ruby on Rails 5.1(管理画面のみ) - Node.js(コメント削除・BAN周り。Docker 環境で ECS 上で実行される) ## インフラ - AWS ECS - AWS S3 - AWS DynamoDB - AWS Kinesis ## その他 - Docker - GitHub - CircleCI # 実装 ## 動画再生不可の問題を解決 生放送サービスの CORS 設定変更により、Web 版では動画再生が不可能になった。 放送の Stream を直接取得するのが望ましかったが、版権や契約の都合により断念。 これを解決するため、ローカルで動作するアプリケーションとして監視ツールを作り直す事になった。 幾つかフレームワークを試したところ、Electron の Webview 経由で再生できる事を確認。 Electron ベースで開発を行い、既存機能を全て移植する事が出来た。 ## 最大監視数の増加 アプリケーション作り直しに伴い、CSS フレームワークを MDL(Material Design Lite) から Vuetify へ変更した。 変更した理由は下記の通り。 - MDL がメンテされておらず、後継として MDC(Material Design Components) がリリースされているが、Vue.js に組み込みづらい - Vuetify の開発が盛んで以前よりも完成度が高い - 用意されているコンポーネントが豊富 - MDL と比較して、Flexbox の対応など使い勝手が良い MDL を使用していた時はコンポーネント数と width の値を逐一計算して動画を並べていたが、 Vuetify では不要になり、さらに複数段組みも可能になった。 その結果、最大監視数を 6 から 12 へ倍増させることが出来た。 ## NG ワードハイライト 当初、コメントのストリームを直接取得できないかサービス側と交渉したが諸事情で断念。 Webview 内コメント欄の DOM を直接監視する方法を採用した。 機能自体は下記の順序で実装した。 1. NG ワードリストは各チャンネルごとに用意、`electron-store`(npm) でローカルに暗号化保存する 2. JavaScript の Mutation Observer でコメント欄の DOM を監視 3. 該当したコメントを mark.js でハイライト表示する 概ね上手く行ったが、1 番目の NG ワードリスト実装時に引っかかった点がある。 Electron の特定バージョンにて、マルチバイト文字列を入力した際に不具合が発生。 この時期の Slack や VSCode も影響を受けていた。 https://github.com/electron/electron/issues/9173 1.7.2 で修正されたものの後のアップデートで再発しており、 Electron のバージョンアップ時に引っかかってしまった。 ## 監視画面から直接コメント削除・ユーザ BAN 削除対象のコメントや悪質なユーザは、本社側で運用している管理ツール経由で 削除/BAN を行うが、 毎回当該コメントやユーザを検索して削除を行っており、時間や手間がかかっていた。 そこで、コメント欄から直接 削除/BAN を行いたいとの要望があったため実装を試みた。 本社側のチームと相談を重ねた結果、管理ツールから ID を付与したコメントを流してもらい、 監視アプリケーション側から管理ツールの API を直接叩く案に決定した。 管理ツール側は kafka でコメントデータを流しているため、下記構成でバックエンドを実装した。 kafka -> AWS Kinesis -> kcl -> AWS DynamoDB -> AWS comment API <-> Electronクライアント kcl: https://github.com/awslabs/amazon-kinesis-client kcl と comment API は Docker ベースで開発を行い、ECS 上でスケーリングにも対応した。 実装を全て終え管理ツールからの接続待ちだったが、本社側のエンジニアチームから実装や運用のコストが厳しいとの結論が出たため、機能自体はお蔵入りとなった。 ## Windows 7 の絵文字対応 生放送のコメント欄では絵文字を多用した荒らしが発生していたが、 監視チームの端末は Windows 7 で Unicode emoji に未対応の状況であった。 調査した結果、 MS が Windows 7 向けに Segoe UI の更新プログラムを配布していた。 https://support.microsoft.com/ja-jp/help/2729094/an-update-for-the-segoe-ui-symbol-font-in-windows-7-and-in-windows-ser 監視チームの端末に更新プログラムを導入して頂き、アプリ側で 'Segoe UI' のフォント指定を行う事である程度絵文字が表示されるようになった。 ## アプリケーションのビルド、アップデート Electron にはアプリケーションのビルド・パッケージングのライブラリが用意されており、 今回は electron-builder を採用した。 https://github.com/electron-userland/electron-builder Electron はアップデート用のAPI (Auto Update) が用意されているが、 electron-builder 側がラップしているため、ある程度は楽に利用できる。 なお、アップデート用の UI は用意されていないため自前で実装を行った。 デプロイ方法は複数あるが、今回は AWS S3 へバイナリを設置する方法を選択。 なお、Mac 版で Auto Update を利用するにはアプリの署名が必須なので、 Apple Developer Program (有料) への登録を行う必要がある。 ## その他 他にも、監視チームからの要望に応じて都度機能を実装した。 - チャンネルの一括・個別ミュート - チャンネルの個別リロード - コメント部分の表示カスタマイズ # 結果 Web 版の機能に加え、最大監視数増加/NG ワードハイライト/Windows 7 絵文字対応といった機能を実装することが出来た。 監視チームからの評判が特に良かったのはNG ワードハイライト/Windows 7 の絵文字対応で、 コメント見逃し率が減少したとの報告を受けた。 最も実装に手間がかかったコメント直接削除・BAN 機能は、 実装・運用コストが厳しいとのことで最終的にお蔵入りとなった。

2018年/1ヶ月以内

アドネットワーク表示先の監視と結果出力

# 概要 グループ会社のアドネットワークで管理している広告が、 監視対象リストに登録された違法サイト(著作権違反、アダルトなど)に表示されていないか確認するアプリケーションを開発。 毎日定時にクロール、スクレイピングを行い、突き合わせ結果を Google Drive へ出力する。 以前は監視担当が手動 or Excelのマクロでリストと突き合わせて処理していたが、 作業の工数を大幅削減/作業ミスを減らす事に成功した。 # 開発環境・技術 - Serverless - AWS Lambda - AWS SQS - AWS DynamoDB - AWS S3 - AWS CloudWatch - Google Apps Script - Google Drive ## その他 - GitLab # 実装 処理の流れは下記の通り 1. 毎日定時に S3 の監視対象リストを元に SQS 発行 2. SQS event 経由で Lambda を起動しスクレイピングを実行 2. 結果を DynamoDB に保存 3. S3から広告配信リストを取得し、DynamoDB のスクレイピング結果と突き合わせ 4. 突き合わせ結果を S3と Google Drive に保存

2018年/3ヶ月以内

チャットツールストレージコスト削減プロジェクト

# 概要 弊グループは全社で ChatWork を利用しているが、 ストレージ利用量が非常に多く、年間数千万の費用が発生している。 そこで、管理者向けにストレージ利用状況の可視化と上位ユーザへの削除を促す DM 送信を行う Web アプリケーションを開発した。 稼働から2週間ほど経過したが、ストレージ利用量を 25 % 程減少することが出来た。 # 問題・要望 # 開発環境・技術 ## フロントエンド - ES6 - Bootstrap - ChartKick(gem) ## バックエンド - Ruby on Rails 5.2 ## インフラ - AWS EC2 - AWS RDS - Ansible - Capistrano ## その他 - Docker - GitLab - ChatWork API # 実装 ## ユーザやストレージのデータ取得に関して ChatWork からユーザ情報とストレージ使用状況のデータを取得するが、 それぞれ管理画面から csv を保存する必要があった。 当初は Selenium などを利用して取得自動化を試みたが、 reCAPTCHA の判定が厳しいため、当面は管理者が手動でダウンロードを行う。 ## csv のインポートに関して 各データが数千行に及ぶため、インポートには activerecord-import(gem) を利用しバルクインポートを行った。 シーケンスインポートに比べ、所要時間が十分の一以下に押されられた。

2015年/1年以内

スマートフォンアプリの開発

# 概要 スマートフォンアプリを自社で開発・リリースするプロジェクトが立ち上がったので、 これに参加表明し開発を行った。 最終的に4本のカジュアルアプリを App Store/Google Play へリリースした。 苦労した点としては、 当時 App Store の審査が2週間ほどかかる状態だったため、 リリースやアップデートを素早く行えずスケジュールが遅延した点。 # 開発環境・技術 ## フロントエンド - Unity4.x ## バックエンド - Fuel PHP ## インフラ - VPS ## その他 - Git

2014年/半年以内

求人・職業マッチングサービス開発

# 概要 沖縄県内へのU・Iターンを対象とした求人・職業マッチングサービスを開発。 PM 1名、エンジニア 2人のプロジェクトで、私はエンジニアとしてフロント・バックエンドを担当。 UI デザインや画像・イラスト・初期コンテンツ(インタビューなど)、全て自社で用意し、外注に頼らない開発を完遂した。 サービス運用自体は数年後他社へ移譲したが、2019 年現在も運用が続いている。 反省点は下記の通り。 - 顧客のヒアリングが不十分でプロジェクトが炎上した - 選定したフレームワークが案件に適していない - テストは手動・目視のみで PHPUnit などを使用しなかった - メンバーが Git 自体にに慣れておらず、適切な運用が行われていなかった # 開発環境・技術 ## フロントエンド jQuery BootStrap ## バックエンド PHP WordPress ## インフラ オンプレ ## その他 - Git - Redmine

マネージメント能力

アピール項目


アウトプット

GitHub アカウント
あり
Qiita アカウント
あり
Speaker Deck アカウント
未入力です
SlideShare アカウント
未入力です
特にアピールしたいアウトプット
未入力です

今後、身につけなければいけないと思っている技術は何ですか?

英語

エンジニアとして影響を受けた本を教えてください

- リーダブルコード - コーディングを支える技術

あなたが一番パフォーマンスを出せるのはどんな環境ですか?

- 騒音が少ない(フロアが静か or イヤホンなどの着用が可) - 上司や同僚と気軽に技術相談が出来る - 各種やり取りを Slack などのチャットツールで完結できる

キャラクター

直近で一番やりたいこと
技術を極めたい
好きなスタイル
好きな規模
水とプログラミングどっちが大事?
自信を持って人より秀でていると言える点
学習能力 / 分析力 / 問題解決力
スキルのタイプ
得意なフェーズ
会社を選ぶ一番の基準
風通しの良さや意思決定ライン
やりたくない分野
SI / 人材 / アダルト / 仮想通貨
その他の特徴
使用言語にはこだわらない / 新しい技術はとりあえず試す
その他のやりたいこと・やりたくないこと
未入力です

やりたい事

手を動かして設計してコードを書きたい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい
価値あるプロダクトを作り成長させたい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい
学び続けて技術力でプロダクトに貢献したい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい
意義があることや社会に貢献できる仕事がしたい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい
人や計画の調整・マネジメントをしたい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい
レガシーなシステムの保守・運用・改善をしたい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい
企画や仕様を考えるところから関わりたい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい
業務効率を改善して一緒に働く人のためになりたい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい
全社横断的な共通基盤作りや強化をしたい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい
組織や文化を作る・成長させる仕事をしたい
絶対やりたくない
あまりやりたくない
別に普通
やりたい
絶対やりたい

基本プロフィール

年齢
今年で30代前半
好きな Text Editor
Vim
希望勤務地
東京都
希望年収
500万円
ただいまの期間
ドラフト参加受付中

  • この期間に審査合格した方は次回ドラフト参加になります
  • ドラフト初参加以外の方は次回のドラフト参加 / 不参加を選択してください
  • レジュメは更新できます
  • 審査は随時行っています
ご意見箱

要望、不具合報告、使いづらい点や感想など、なんでもお気軽にご連絡ください。

y4shiro
今年で30代前半
Vim
参加ステータス
不参加
転職意欲
参加回数
2回
累計平均提示年収
559 万円
SIGN UP
SIGN IN


このサービスを友人に薦めたいですか?