Works

BIKE CATALOG (Input Assistant)

BIKE CATALOG

コンテンツ自体は数年前に作成した通常のWordPressのもの。表示側も標準のテンプレート。データーをFlickrの情報と紐付けし、画像を動的に出力。また関連商品をECサイトの商品へリンク。

最近の作業としては入力画面上(WordPress)での効率化。週にすると多くて10件以上は更新があります。

使われているパーツのテキストのリストから、関連商品の検索リンクを生成。キーボードをタイプすることなくクリックだけで関連商品を選択できる。

商品の検索結果の中から選択された商品と、すでに選択されている商品とで表示を分離。また、裏側のデータを反映させるタイミングと表示側で整理するタイミングをあえて分け、使い勝手を考慮している。

また、テキストデータをFlickrの情報からコピペする際に、規定のフォーマットをベースに入力の補助をしています。

例えば「タイトル」に「 *[メーカー名]* [モデル名] ([サイズ])」のような形式のFlickrからデータを貼り付けると、正規化しそれぞれの入力に追加、また該当するメーカー名・モデル名のカテゴリを選択、など。

今後の改善点としては自動入力時のリアクション(背景色をつけるなど)があると機能の認知や間違いの防止に繋がるかなと思います。

上記組み合わせで入力作業がかなり短縮されました。

https://bluelug.com/bike-catalog

Vue.js JavaScript jQuery FlickrAPI