https://gyazo.com/341f5842bd8857e1b0ce9438fd17ff8c
5年前に入社
コンテンツを販売できる
継続課金も可能
サブスクライブ
note.mu => note.com に
今年中に出来たらいきたい
開発チームについて
エンジニア15名
中途オンリー
入社4ヶ月のQAエンジニアから見たnoteの課題とやっていること 2018/10入社
JSTQB Foundation Level受験・合格
自動テスト周りを中心
CS, QA, BtoC, BtoBとこれまでの経験が活かせそう
自動テストをやりたい
一人目のQA
やったこと
GitHub issue上でやりとり、バグ報告・気付いた点もコメント Androidエンジニアがすでにいろんな端末でrobo testを実行
iOSはエンジニアがアプリ操作→スクリーンショットを撮るように
WebのQA
大きなバックログの受け入れテストを手伝う
テストパターン洗い出し手伝い
自動化、テストツール整備
日本語入力、ファイルのdnd以外はだいたいOK
nuxt化したページのデグレ対応
登録、投稿など
CS連携
定例MTGに参加
リリース前にCSに機能を触ってもらう
公開した記事を下書きに戻せる機能を触ってもらう
仕様理解を深めて、問い合わせ対応速度を上げる
きづいたこと
モバイルQA
動作確認大変
キャリア決済
ノート投稿。無言音声収録
期待結果に到達するまでの事前データ作成が大変
例：有料記事作成
自動化したい
WebQA
リリースサイクルが早い
振り返りがあまりない
テストデータをつくるのが大変
独自ドメイン忘れがち
自動化したい
自動化、テストツール整備
効率的にメンテするにはPageObjextデザインパターンを理解する
JSを書く必要ある
CS連携
バグ対応の対応速度にばらつき
あまりフローわかってない
決まった人しかやれないオペあり
kaizenチームしか対応できない
リリース前からCS*Dev連携必要
その他
開発者ぼっち問題
コードレビュー文化になってない
バグったら自分が対応
障害レベルの問題なのに報告が残ってない
テストとは・自動化するとどうなるの？の認識あわせ
今後のテーマ
自動化とツールを駆使して、安定したnote開発サイクルを回す仕組みを協力して作る
2018/11月入社
フロントエンドリプレイスを担当
Lambda => ElasticBeanstalk
Issueを潰すためのFollow Up Day開催
チームが4 => 7人にスケールアップ
11画面をリリース
Migration
nuxt-sass-resources-loader => @nuxt/style-resources
Smart Prefetch
notedemo ページ遷移で体験できる
開発過渡期でbundleファイルサイズが増加して初回レンダリングが課題
app.js 665KB
なぜやるか
FMPまでの時間削減
ユーザーの操作に応対できる時間削減
const DynamicComponent = () => import('~/Components.vue')
665KB => 215KBまで落ちた
見えた課題
モーダルのレンダリングが初回とは関係ないので非同期に
LazyLoadingComponent: () => import(~/Components.vue)
結果
firstByte
1.87s => 1.12s
LoadTime
8.28s => 7.89s
fullyLoades
8.56s=> 7.17s
firstPaint
3.65s => 2.9s
speedIndex
6.6s => 5.43s
visualComplete
8.35s => 6.92s
今後の表示速度をあげる課題
Loadsh
Backend APIのレスポンス
Imageの処理
AngularとNuxtを比べる
NuxtはSSRなのであまり比較としては平等ではないが 2019/1に入社
インフラ・サーバ担当
10面ディスプレイとは
執務エリアにあるディスプレイ群（10面）
https://gyazo.com/f46bdb6e6f83092af6451f2a136415e2
外苑前に越したときに構築
スタートアップ時にIEが立ち上がる
実運用問題
キーボードを利用して手動で操作
表示リソースがスクリプトに直で書かれている
人間が都度移動して管理する
Electronを使うのはどうか
環境構築が楽
Electronはどうつかっている？
クライアント <=> サーバーモデル
人間工数問題を解決
Slackから制御できるようにした
DB操作だとエンジニアが必要
Slackコマンド
/display {ディスプレイ番号} {URL}
/display nekoは猫を表示する
デモ
https://www.youtube.com/watch?v=T5E9PW1wpHc
https://www.youtube.com/watch?v=RZ_lthXn8bE
課題
require('db.json')
BrowserWindow
force-reload未対応
Windowsアップデート
ウィンドウが固まるときの対応
参考
緑川晃
2018/8入社
サーバーサイド開発をやってきた
レコメンド
一番下に移動すると出てくるもの
こちらもおすすめ部分
しくみ
テキストから似ている記事をユーザにおすすめ
2018/4にリリース
課題
そもそも精度が低い
似ている記事ではなかった
前任者が辞めて居ない状態
改善
数値をとる
レコメンド表示とクリックの詳細をとる
わかったこと
ランダムのレコメントが多い
バッチがレコメンド結果を生成するまでに記事をランダム表示
期間が異様に長いことがあった
仕組みを１から作り直した
記事を公開したらすぐ解析
レコメンド精度を上げる
パラメータ調整
コーパスのサイズを増やす
おすすめ記事は1万記事しかない
学習にデータ量が足りてない
比較・定性評価
https://gyazo.com/98bf80cacfcbba0a49e2b40f86ef9eb5
類似度が上がっている
進捗
CTR：4%上昇
クリック数：3~4倍
tech記事がバズった
通知が止まらない
投げ銭
仕事にならない
バズる傾向
チーム体制での成功・失敗体験
技術系エッセイ
Rui Ueyamaさん
山本一成さん
キャリアの体験談
チュートリアル
Daiさん
採用・転職
お金
所感
体験談は人気
採用・転職はエンジニア大好き
エンジニア以外にもユーザがいる
非エンジニアにもわかる話題はウケる
ファイルアップロード機能が出る
きっかけはボタンコンポーネントがリンクかJavaScriptで飛ばすものかスタイルガイドとして分かりづらかったこと 最初にIssueを上げたエンジニアは普段キーボード操作を多様していた
noteでそれができないのは気になっていた
Issueとして上げていてエンジニアやデザイナー、全体感として気を付けねばと意識を変えた
今はキーボード対応ができるようになるところを目指す
視覚障害者対応などはまた別のコスト感で捉えている