食べチョク開発者ブログ

食べチョクエンジニアによるプロダクト開発ブログ

デザイン

デザインチームの成長を加速する!内省(リフレクション)の技術

こんにちは、松久です。 各自で「ふりかえり」をして、人事評価がされます。 私も「ふりかえり」をするのですが難しいです。適切な「ふりかえり」だったのかわからず、手探りで行うことが難しく感じます。 そこで「ふりかえり」をどうやっているのか、まとめ…

トイルを減らすデザインチームの行動

こんにちは、松久です。 日々の"業務"の中には、手作業が定期的に必要で、必要だけれどデザインチームでなくてもいいし、サービスの変化とともに増えていることに気づく業務があります。こうした業務を「トイル」と呼んで減らすようにしています。 トイルと…

デザインチームに新メンバーを迎えるオンボーディングのくふう

こんにちは、松久です。 昨年(2023 年)、デザインチームに新しいデザイナーが加わりました。新しいデザイナーがすぐ活躍しやすいようにオンボーディングを実施しました。 デザインチームでのオンボーディングとは デザインチームでのオンボーディングが久…

「ふりかえり」から始まる2024年デザインチームのカイゼンプロジェクト

こんにちは、松久です。 先月、デザインチームで 2023 年の「ふりかえり」をはじめました。はじめて、1 ヶ月経ちますが、まだ終わっていません。終わっていませんが、なかなか良さそうだと感じています。 「ふりかえり」をすることにした理由 2023 年は、チ…

デザインチームの2023年のブログを振り返り!変化と継続、そして2024年への動き出し #デザイン #ブログ

こんにちは、松久です。 デザインチームの 2023 年のブログ記事をふりかえり執筆後から変わったことや、変わらなかったことを書き出すことで、2024 年に向けて動き出せるようにします。 Figma のファイル管理ルール( 2022 年 12 月 ) ファイル名については…

画像制作依頼チェックリストから普段のヒアリング内容を確認した話

こんにちは、松久です。 食べチョクでは様々なところで画像が作られています。 これらの画像は、様々な部署からの依頼をうけてデザインチームで作ることが多いです。一部、テンプレートから画像を作っているのもありますが、まだ、デザインチームで作ること…

デザインと上手くお付き合いする方法を社内で発表した

こんにちは、松久です。 株式会社ビビッドガーデンでは、「週次 Sync & Share の会 」が開催されています。 (だいたい)毎週、各チームから全社に向けて、学んだことを伝えたり、聞いたりしています。 デザインチームから Sync & Share 会で「デザインと上…

GitHub Projects でデザインチームのタスク管理をするノウハウ

こんにちは、松久です。 デザインチームでは、GitHub Projects でタスク管理しています。 タスク管理する理由はいくつかあります。 「食べチョク」の改善を少しでも進めるため チームで効率的に改善を進めるため 他のチームと一緒に仕事をするため チームで…

おいしそうが伝わる写真を選ぶ原則をチームで共有した

こんにちは、松久です。 「食べチョク」では、キャンペーンなどで使うバナー・キービジュアルを自社で作成しています。作成する時に使う写真は、素材サイトで配布・販売されている写真や、生産者さんが撮影された写真を使います。これらの写真から使用する写…

桃やぶどうのような同じ品目でバナーを作る前に事前準備したこと

こんにちは、松久です。 「食べチョク」では、桃、ぶどう、梨の特集をしています。 特集では、キービジュアルや「チャート」と呼ばれる品種の収穫・販売時期を 1 枚の画像にまとめています。他にも「桃占い」というコンテンツの作成もありました。これらの画…

「似ているけれど少し違う色」を減らす取り組み

こんにちは、松久です。 UI を作るときに、色は定義されている中から選ぶのを基本にしています。 色の定義が Figma で行われ、実装に反映され、違う場合は Stylelint で指摘される運用がされています。 色の運用が進んできたので、過去に定義した色や、デザ…

ふりかえりからデザイナー同士のミーティングを改善しました

こんにちは、松久です。 以前、「デザイナー同士で行う 3 つのミーティング設計」というお話を書きました。そこから、半年ぐらい運用していくなかで、変えたことがあります。 変わらないこと 大きく 3 つのミーティングがあることは変わりません。 プランニ…

FigmaとSCSSで色の定義を合わせるための運用方法

こんにちは、松久です。 食べチョクでは、デザインツールとして Figma を使っています。色の定義を Figma の Color Styles で管理しています。 管理はしているものの SCSS には反映できていない状態でした。このままだと何が管理されている色なのかエンジニ…

バナー作成をデザイナー以外でも作成する運用をはじめました

こんにちは。松久です。 キャンペーン、ニュースリリース、LINE など様々な場面で使われる画像は、デザイナーのみが制作していました。デザイナーだけで制作するには限界があり、作成の一部をデザイナー以外でできるようにする取り組みを行っているお話です…

Figma の操作を方法学んでデザインデーターができるまでの過程を知る

こんにちは、松久です。 食べチョクでは Figma をデザインツールとして使っています。デザイナーが作った Figma のデザインデータを見てエンジニアはHTML/CSS を書いています。このとき、わかりにくいデザインデータを見かけるときがあります。解決の糸口を…

Figma のファイル管理ルールを決めて業務を円滑にする取り組み

こんにちは。食べチョクの松久です。 今回は、複数人で Figma のファイルを管理するために工夫していること、悩んでいることも含めてどのようにしているかを紹介します。 ファイル管理をする目的 ファイルを管理する目的は、なんでしょうか。 複数人でデザイ…

デザイナー同士で行う3つのミーティング設計

こんにちは。食べチョクの松久です。 今回は、デザイナーの活動を支えるミーティングをどうやっているか紹介します。デザイナーが関係するミーティングは3つあり、それぞれのミーティングの目的を説明していきます。 プランニング・交通整理 月・水・金曜日…

デザイナーへの依頼数を GitHub CLI と jq を使って集計する

こんにちは。食べチョクの松久です。 今回は、デザイナーへの依頼数を GitHub CLI と jq を使って集計している話を紹介します。 どうして、依頼数を計測することになったのか、どうやって GitHub CLI と jq を使って集計しているのか、を順番に説明していき…