Inside BuildIt

株式会社ビルディットのデザイナー・エンジニアによるブログです

ゆるはち.it 第14回【CSSフレームワークについてゆるく話す】参加レポート

はじめに

7月に入社した日置です。よろしくおねがいします。最近は Rust にお熱です。

ゆるはち.itの紹介

ゆるはち.it は毎月八王子でやっている勉強会で、八王子にもかかわらず新しめの技術を知れるし話せるのが特徴です。

ビルディットに入社する前にも自分は二度ほど参加し、一度目は聞く側で、二度目は話す側で参加しました。最初に乾杯があり、徐々にお酒もまわっていきますので、発表も気楽です。

ちなみに自分は前回の ゆるはち.it では『Rust で学ぶ TOTP』を話しました。

speakerdeck.com

このテーマに決めたのが Rust に入門して 1 週間程度で「さて Vim で書く準備は整った」レベルだったため内心ヒヤヒヤしていましたが、なんとかうまくまとまった気がします。

ちなみに Rust に入門した経緯というのは、代表のとみたさんに『実践Rust入門』を一緒に読まないかと誘われ、ハマってしまいそうで危険だなと思いつつもホイホイ付いていったのがきっかけでした。

gihyo.jp

そんな感じで個人的にはとにかく発表の敷居が低いため、自分のような発表駆動で学びたい方など気軽に申し込んで頂けるとありがたいです。お酒を飲みながらほへーと聞きますので。

ゆるはち.it【CSSフレームワークについてゆるく話す】のレポート

今回のテーマはCSSフレームワークで、以下のような三本立てでした。

  1. 『CSSフレームワーク選びのポイント』
    • CSSフレームワーク界隈の話 (Bootstrap, Bulma, Semantic UI, PureCSS, Tailwind, Tachyons)
  2. 『Tailwind CSSでいろんなUIをつくる』
    • 界隈で満足度 No.1 の Tailwind を使った具体的な実装の話
  3. 『CSSフレームワークに頼らない受託マークアップエンジニアのサイト制作術』
    • 現場感ある熱い話

まずは全体像を話し、その後具体的な実装も見せ、最後には頼るな!という何というかキレイな流れだったように思います。

では、ひとつずつ見ていきます。

トーク1: 『CSSフレームワーク選びのポイント』

speakerdeck.com

スライドで紹介されていた以下のページ、このページを知れただけでも自分には価値が十分にあるというか、

2019.stateofcss.com

恥ずかしながら自分は Bootstrap しかちゃんと触ったことがなかったですが、すごく楽しめましたし勉強になりました。

  • ユーティリティ系 or UIパーツ系
  • デザイン仕上がってる or デザインあっさり

というような軸で分析されていて、大変わかりやすかったです。さらっと読めるので自分のような CSS 弱者は騙されたと思ってぜひ読んでみてほしいです。

トーク2: Tailwind CSSでいろんなUIをつくる

speakerdeck.com

Tailwind を使ってモーダルを一から作っていく過程を Storybook でリアルタイムプレビューしながらデモしていくという内容でした。

自分は途中懇親会用のピザを取りに行く必要があり泣く泣く抜けて中途半端にしか見れていませんが、実践的でわかりやすかったのでもう一度見たいと強く思いました。

コードは以下にあります。clone して README どおりに $ npm i, $ npm run storybook, $ npm run dev すればデモ当時の環境がサクッと起動します。ぜひ!

github.com

LT1: CSSフレームワークに頼らない受託マークアップエンジニアのサイト制作術

  • 案件によってはすでにひととおりでき上がったのものに対してスタイルを当てるといったものも多く、そういった場合に後からフレームワークを導入するというのは難しい。
  • そんな時にも便利な自分なりの最小限のフレームワークを持っている。
  • さあ、HTML と CSS を知るんだ!!

というような検索では見つからない現場感ある熱い話を聞けました。心にしみました。

とびこみ LT2

西東京のデザイン系の勉強会がないから作ったというお話でした。デザインの実践に近い勉強会で、次回はバージョン管理の話をするようです。こちらもぜひ!

westtokyowebstudy.connpass.com

次回告知

次回のゆるはち.itは「地味にスゴイ! Webデザインテクニックについてゆるく話す」です。

yuruhachi-it.connpass.com

開催日程は 10/30 (水) です。登壇者もまだまだ募集していますので、ぜひ!

おわりに

ビルディットでは、「つくることで生きていきたい」クリエイターを募集しています。 新しい技術に関心のある方はぜひお気軽にご連絡ください。

採用情報|株式会社ビルディット「手段を目的化」する同業組合型IT企業

ゆるはち.it 第12回【スプレッドシート駆動開発】参加レポート

はじめに

こんにちは。
株式会社ビルディットでWebエンジニアをしている佐野です。
最近はLaravelで権限管理のコードに触れていたのですが、ややこしいケースがあって非常に悩みました……。
大半のプロジェクトで権限について考える機会はあると思うので、ぜひこの辺りもお話ができたら楽しいなと思います。

さて、今回も先月に引き続き、私が運営に参加している勉強会 「ゆるはち.it」についてレポートを書きます。

ゆるはち.itの紹介

ゆるはち.itでは、毎月末水曜日に月ごとにテーマを決めて勉強会を実施しております。八王子という都心から離れた場所で、ゆる〜い雰囲気で勉強会をやってます。
「都心までいくのは面倒だけど、新しいITの話をしたい」とか、「ガッツリした講義のようなイベントはちょっと……」という人にオススメの勉強会です。

毎月登壇者も募集していますし、「次回のテーマはデザインについてが良い!」というような声があれば、沿ったテーマで勉強会を開催します。
勉強会のタイトルにもある通り、とにかく「ゆるく勉強会をやろう」というコンセプトです。
ご興味がある方はぜひ参加してみてください。
直接声をかけていただいても嬉しいです!

connpassページはこちら↓

yuruhachi-it.connpass.com

ゆるはち.it【スプレッドシート駆動開発】のレポート

どんな勉強会だったか

今回のテーマは「スプレッドシート駆動開発」でした。
RPA(ロボティック・プロセス・オートメーション)の台頭や、Googleスプレッドシートの登場で、改めて注目を浴びています。
情報システムの現場ではデータの管理から、業務の改善まで。
その他の企業においても発注書をスプレッドシートで作ったり、家庭においても物品のリスティングなどと、さまざまな利用法があります。 最早、誰しもが触ったことのあるツールであることは間違いないと言っていいでしょう。

そんなスプレッドシートに関する勉強会ですが、内容としては、

  • Google Apps Scriptを利用して、モダンにスプレッドシート駆動開発をする
  • スプレッドシートと連携したWebサービスの紹介
  • 実際の開発現場におけるエクセル利用の事例

と多様な視点からのトークが集まりました。

それでは、1つ1つのトーク内容について触れていきます。

トーク1: モダンGASプログラミング

手前味噌ですが、私が発表させていただいたトークです。
巷でGoogle Apps Scriptが流行っていたので、Google Apps Scriptに纏わる話をいろいろとさせていただきました。

Google Apps Scriptの紹介から、利用事例、その他Google Apps Scriptの便利機能。
そして、claspを利用してさらにモダンな開発環境を作ろうといった内容です。
claspを利用すれば複数人での開発もやりやすくなり、属人化しやすいスプレッドシート開発をコード化できます。
ぜひ使ってみてください。

資料はこちら

トーク2: Google Sheetsを活用したサービスの紹介

さまざまなスプレッドシート関連のサービスが登場しているので、そのサービスについて調査/紹介しているといった内容です。

f:id:jalemy:20190816113729j:plain

スライドにて紹介されているProduct Huntを利用して、スプレッドシート関連のWebサービスをみてみたのですが、執筆時点で100種類近く存在しました。そんなに種類あるのか……と驚きます。

  • スプレッドシートをデータソースとしてWebサイトを構築するサービス
  • スプレッドシートをDBとして利用できるようにするサービス
  • スプレッドシートと自然言語処理を組み合わせたサービス
  • コラボレーションツール

とさまざまなサービスが存在しました。

最後には、発表者自身がRuby on RailsGoogle Spread Sheetsを組み合わせてWebサービスを作ってみたという内容もあります。

そんな発表の資料はこちら

LT1: ワードとエクセル(と山盛りのVBA)で作る、要求仕様書と受入テスト仕様書の一例

実際の開発現場におけるワードとエクセルの利用事例です。
私はVBAを見たことはあるものの、実際に書いたことはほとんどないため、かなり興味深い、濃い内容でした……。
エクセルに列挙された内容をもとに、テスト仕様書が自動生成される図は必見です。

機密事項が多いため、スライドにはあまり情報が乗っていません(気になる方はぜひ勉強会へ)

Tips

ゆるはち.itでは、トーク終了後に懇親会の時間を設けています。
会場の近くにあるピザ屋さんのピザを食べながらいろいろなことを話しています。
ここでの出会いがもとになり、「次回登壇することが決まった」とか、「新しい仕事が決まった」とか、そんな話もあるとか。
新たな出会いを見つけられることも勉強会のメリットかなと感じました。

f:id:jalemy:20190816114031j:plain

次回告知

次回のゆるはち.itは、「Web開発の認証」がテーマです。
開催日程は、8/28(水)です。

トーク、LTともに登壇者を募集しています。興味のある方はぜひ申し込んでください!
もちろん聞く人枠でのご参加も大歓迎です!

connpassページはこちらです。

yuruhachi-it.connpass.com

おわりに

ビルディットでは、「つくることで生きていきたい」クリエイターを募集しています。
新しい技術に関心のある方はぜひお気軽にご連絡ください。

bldt.jp

「協働」で、より良いサービスをつくる。リードエンジニア×若手UIデザイナーインタビュー

こんにちは。広報の大木です。

弊社がサービスデザイン・設計開発に参画した、ジギョナリーカンパニー様が提供するソーシャルロケーションサービスの「MachiTag(マチタグ)」が今年4月にサービス開始しました。弊社からはエンジニアの斉藤とデザイナーのgrapeの二名が関わりました。今回その二人のインタビューをご紹介します。

f:id:miyakmakij:20190725103621j:plain

ビルディットの開発スタイルの特徴として、エンジニアとデザイナーが一つのチームで常に協働していること、いつでも気軽に話せる近い距離で仕事をしていることがあります。

そしてもう一つ、メンバー固有の要素とも言えますが、UI/UXデザインに知見のあるエンジニアと、エンジニアリングの知識があり実装ができるデザイナーがいることによって、社内に職種の境界による分業意識がなく、お互いがより良いもの作りを追求できる環境ということも大きな価値を持っています。

インタビューは、若手デザイナーであるgrapeの視点をメインに、開発の様子、デザイナーの役割、デザイナーとエンジニアがチームで協働することがサービスにとって、また自分にとってどんなメリットがあるのか、などを聞いていきたいと思います。

また、grapeは現在大学院に通う学生でもあり、若いメンバーがどう成長しているかを知っていただき、同じく学生で将来デザイナーを目指す方や、若手デザイナーの皆さんにも、自身が働く場を考える際のヒントがあればと思っています。

目次

人物紹介

grape(デザイナー)

大学院でUI/ UXを専攻する中国からの留学生。現在は週3日勤務。 日本に来る前は中国で大学卒業後、新卒で上海Uber社(世界規模の配車Webサービス事業)でUI・グラフィックデザイナーとして1年間の実務経験。 学生アルバイトでありながら、ベーススキルもしっかりある頼もしい存在。

※学業が本分なので、本名でなく社内のニックネームでご紹介します。

斉藤(リードエンジニア)

ビルディットでは代表の富田の次に二人目のメンバーとして参画。得意分野はフロントエンド(React, Vue…)、前職はグッドパッチ社でUI/UXの経験を積み、デザインにも深い知見をもつエンジニア。

f:id:miyakmakij:20190724151254j:plain
(左)grape  (右)斉藤

「MachiTag」開発、そしてリリース

f:id:miyakmakij:20190724150706p:plain
https://www.machitag.com/

──MachiTagは「今いる場所で、探さなくてもいきたい場所が見つかる。ユーザー中心のロケーションプラットフォーム」をコンセプトとしていますね。 クライアントと最初にサービスについてお話ししたときの印象は?

斉藤)そうですね。最初にサービスのコンセプトをお聞きした時には、汎用的に使える、業界問わず広がりのありそうなサービスだなと思いました。 技術的には、地理情報(GIS)を使ったサービスということで、初めて取り組む機能もあり、ワクワクしながら開発を進められました。

──開発が始まったのはいつ頃からですか?

斉藤)今年の年明けくらいです。grapeはそれまではリードデザイナーの石崎と一緒に仕事をしていましたが、MachiTagはデザイン提案からgrapeにメインでやってもらいました。

grapeがビルディットにきて半年強の頃ですね。

──grapeさんにとっては、要件からローンチまでをメインで携わった初めてのプロダクトということですね。最初にアサインされた時と、リリースの時の気持ちを聞いてみたい!

grape)アサインの前、別案件で石崎さんの手伝いをしていました。ある時富田さんから「新しいサービスを作りたい?」と聞かれて、「もちろんやりたいです!」と答えました。

それからMachiTagの話を聞いて、その開発に自分がメインデザイナーを担当できると知ったときは、興奮と、正直にいえば少しだけ不安もありました。もっと頑張ってもっと成長しないといけないと。 リリースのときは、本当に何もないところからゼロから携わったので、それはもうとにかく興奮です。やりきった感、達成感のひとことです!

それぞれの役割分担

──エンジニアとデザイナーとでチームで開発するというのは具体的にはどんなふうに役割分担をして進めていくんですか? f:id:miyakmakij:20190726132533j:plain

斉藤)クライアントとのやりとりやヒアリングは主に私が担当しました。 クライアントのやりたいことを理解した上で、grapeに相談して、デザインを作ってもらいます。

役割分担としては、デザイナーにはデザインを作る段階ではユーザーニーズに思いきり寄せたデザインを作ってくれることを期待しています。

エンジニアは実現性の視点が最初にきてしまうので。

実装面でのレビューが必要な分、より時間がかかってしまうのですが、最初から実装のことを考えたデザインに収めるとユーザーにとっての最適を追求しにくいし、なによりも面白いものが作れないですよね。

デザイナーにはユーザーがワクワクするようなデザインとか、ブランドイメージに思いきり寄せてデザインを作ってもらって、現実的な仕様とそれの最大公約数を探るのが良いサービスを作るっていうことだと思っています。それが役割分担のベースです。

──なるほど。仕様をもとに実現性から考えるエンジニアと、ユーザー体験や使い勝手の優れたものを考えるデザイナーが、それぞれ自分の領域を思いきり膨らませるんですね。

日々の仕事のすすめかた

──日々の実務はどんな感じに回っているんですか? f:id:miyakmakij:20190724150914j:plain

grape)流れとしては、クライアントとの窓口である斉藤さんがIssueを書いて、それを見える形にするのが自分、デザインしたものをクライアントに確認にして、また必要なIssueが上がって、を繰り返していきます。Issueの管理はGithubです。

Issueには細かい補足も丁寧に全部書かれていて、ちょっと確認したいことなんかはいつも側で仕事しているので気軽に聞いてますね。

斉藤)普段からよく話しているから話しかけにくいとかは全然ないよね。

自分がIssueに書いたことが伝わりにくいかなと思うことは事前に口頭で認識合わせもしますけど、分かりにくいことがあればすぐ聞いてくれると思っているから全く不安に思うことはないですね。

grape)先輩デザイナーの石崎さんはMachiTagではアドバイザー的な関わりですが、必要に応じてレビューをお願いしています。 斉藤さんはUIが分かるエンジニアなのでデザインについても意見がもらえるんですが、UIデザインの専門性がより高い人にもらえるレビューはまた違う視点があります。

斉藤さんからの意見はどちらかといえば実装よりで、石崎さんはデザインより、それは当然なんですが、UIが分かるエンジニアである斉藤さんと、実装が分かるデザイナーである石崎さんからのアドバイスは、普通のエンジニア・デザイナーとは一味二味違って、すごく勉強になります。サービス作りは刺激的ですごく面白いです。

新しいサービスの開発は難しい

──「MachiTag」のサービスは、既存のグルメサイトやSNSとはコンセプトにかなり違いがありますよね。そういう今までにないサービスの設計は、開発が難しいですか?

grape)そうですね、自分にとって難しいことはたくさんありました。

タグの導線とか、ユーザーの動き方とかが今までにない新しい仕様なので、ユーザーにどうやって使うメリットを伝えるか、直感的に使ってもらうにはどうしたら良いか、が課題でした。

──どんな風に課題を解決していくんですか?

grape)自分のアイデアをまず斉藤さんに話して、OKが出たら週に1回のクライアントとの定例会で相談します。週に一度直接話せる場があるのが、課題を共有しやすくて良かったです。

──定例会はいつもスムーズに進む?

grape)いや、スムーズにいかないこともあります。

クライアントからの要望は、デザイナーが考えるユーザー最適とは一致しないことがあります。 お互い主張するだけでは平行線なので、その場で適切な落としどころを話し合って決めていきますが、やはり難しいです。 だからこそ定例会で毎週直接相談できるタイミングがあるのは良いですね。 f:id:miyakmakij:20190724151020j:plain

協働のメリット

──「協働」というキーワード、そのメリットはなんですか?

斉藤)協働のメリットというよりは、自分は以前の会社でもデザイナーと一緒に案件を進めることが多かったので、そうじゃない環境で良いサービスを開発するのはすごく難しいと思いますね。

一度、デザインが決まっていてこの通りに作ってくれ。という案件があったのですが、実現性を無視したデザインになっていたりして、実装に苦労したことを思い出します。 「協働」することは自分にとっては良いサービスを作るための重要なファクターですね。

さっき話が上がった通り、デザインが分かるエンジニアと、エンジニアリングが分かるデザイナーというメンバーだからこそ、それぞれの境界があまりなくて、お互いがそんなに努力することなく協働できる環境をより醸成しているのかもしれませんね。 お互いへの理解が薄いと、協働するための歩み寄りがほんとうはもっと必要なのかも。

grapeがそんな感覚を身につけてきたのと同じように、これから新しいメンバーが増えていく中でそれが標準になったら良いですよね。

f:id:miyakmakij:20190724151112j:plain

ビルディットにきた経緯

──話は遡りますが、grapeさんがビルディットにきた経緯を教えてください。

grape)ビルディットにきて1年ちょっとです。

大学院に入学して、大学と自宅から近い場所で仕事があればと思ってWantedlyで「八王子 デザイナー」で検索してビルディットの求人を見つけて。 日本での仕事はビルディットの前にもう一つ、都心にあるシェアサイクルのスタートアップ企業でインターンをやりました。

斉藤)grapeは学生だけど、UIの経験もあるし中途採用のメンバーと同じような感覚でしたね。最初からベーススキルはしっかり持っていたし。初めからそれなりに任せてました(笑)

grape)中国での仕事はグラフィックデザインがメインだったので、UIを本当にやったのは日本に来てからですけどね。 それと以前はデザイナーだけのチームで仕事をしていて、エンジニアとの関わりは全くなかったんです。完全に分業で、デザインを渡すのもマーケティングチームでした。

UIデザインとかアプリは作りながら改善が必須だからいろんな人と関わりながら仕事しますよね。環境は全然違いますが、今の方が自分のやりたいことができています。

成長の実感

──ビルディットで1年、成長したって感じますか?

grape)感じます! 一つはデザインのプロセスですね。

サービス開発はグラフィックのようにビジュアルを作って終わりではないので、デザイン提案から始まってリリースしてその後の分析・検証…とかの一連のサイクルに関われるようになって、それが前よりもうまくできるようになった気がしています。

もう一つは「アプリ」の理解、というか、日本と中国では「使いやすい」の仕様・ロジック・考えが全然違うんですよ。 その違いに戸惑っていることが多かったのが、日本のアプリへの理解が追いついてきました。

あと大学院で勉強していることもUXなので、勉強で得た知識を実務に反映してみたり、その逆もあったりで両得な感じです。

──斉藤さんからみて、grapeさんの成長ってどんなことですか?

斉藤)もとからちゃんと経験もあって、できる人だと思っているけど、アプリとWeb両方をバランスよく経験つめているし、ローンチして終わりじゃなくて運用改善までやってもらっていて、そこに必要なコミュニケーションもさらにうまくなっているなって思いますね。

これはビルディットにきてからの成長ではないのかもしれないけど、グラフィックセンスがあっていつも綺麗なものを作ってくれるので信頼してます!

grape)(照)ありがとうございます! f:id:miyakmakij:20190724151210j:plain

この先の進路

──大学院を卒業した先の進路は決まっているんですか?

grape)まだちゃんと決めていないですね。。

もし中国に戻るとしたら、アリババのような大きい会社でUIUXをやりたいと思うし、チャンスがあれば日本で就職したい気持ちもあるし。 両親と離れてずっと日本で生活し続けるのは親が心配なんですけど、両親からは日本で就職したら?とも言われたり。すごく迷います!

──クライアントに自分の意向をちゃんと伝えられるくらい日本語は堪能だし、今までの経験と実績があれば、そのどちらでも希望する道を選択できそうですね! ビルディットという選択肢ももちろんありますよね(笑)

f:id:miyakmakij:20190726132900j:plain お二方、ありがとうございました!

エンジニアとデザイナー、それぞれの専門職が「協働」するのに、双方で何らかの努力、または何らかのノウハウが必要なのではないかと思っていましたが、お二人の話を聞いているとあくまで自然に役割分担と相互補助の関係ができているように感じました。

デザインが分かるエンジニアと、エンジニアリングが分かるデザイナー、そのメンバーたちのチームワークが、クライアントにとって、そしてユーザーにとって最適なサービスを生み出せるだけでなく、若手のメンバーを広域のスキルを持った次世代のクリエイターへ育成することにも繋がっているのだなと思いました。

ビルディットは現在のところ少数精鋭といった所帯ですが、若手が育つ環境もしっかりあると感じたインタビューでした。


弊社デザイン顧問イシジマミキとリードデザイナー石崎の対談リポートも 合わせてぜひお読みください! inside.bldt.jp

inside.bldt.jp

bldt.jp

ゆるはち.it 第11回【Web開発のテスト】参加レポート

はじめに

はじめまして。
株式会社ビルディットのエンジニアの佐野です。
先月6月頭に入社しました。
以前は、Unityでゲーム開発のクライアント側の開発に携わったり、PhoneGapを利用してモバイル向けのアプリケーション開発をしたりしてました。
Webエンジニアとしては経験が浅いですが、どうぞお手柔らかに……

今回は、私が運営メンバーとして参加している勉強会「ゆるはち.it」について紹介&参加レポートを書きます。

ゆるはち.itの紹介

ゆるはち.itでは、毎月末水曜日に月ごとテーマを決めて勉強会を実施しております。八王子という都心から離れた場所で、ゆる〜い雰囲気で勉強会をやってます。
「都心までいくのは面倒だけど、新しいITの話をしたい」とか、「ガッツリした講義のようなイベントはちょっと……」という人にオススメの勉強会です。

毎月登壇者も募集していますし、「次回のテーマはデザインについてが良い!」というような声があれば、沿ったテーマで勉強会を開催します。
勉強会のタイトルにもある通り、とにかく「ゆるく勉強会をやろう」というコンセプトです。
ご興味がある方はぜひ参加してみてください。
直接声をかけていただいても嬉しいです!

connpassページはこちら↓

yuruhachi-it.connpass.com

ゆるはち.it【Web開発のテストについて】のレポート

どんな勉強会だったか

今回のお題は、「Web開発のテスト」でした。
ソフトウェアテストの概論から始まり、実際にテストフレームワークを利用してライブコーディングまで見れるという内容です。

トークの節目節目に、「E2Eテストやってる方どのくらいいますか?」とか、「カバレッジ80%以上を目指してる人!」とか挙手を募ってアンケートを取っていました。業界の実状が垣間みえて興味深い時間でした。

f:id:jalemy:20190710133750j:plain
ゆるはち.it【Web開発のテストについて】の様子

参加者については、意外にも(?)現在Webエンジニアではないという人が多かった印象です。
普段はWindowsアプリケーションの開発をしていて、C#をメインで書いているとか、それに近しい業界の方が多かったような気がします。
(主観的な観測なのでゆるく捉えてください)

私自身は、駆け出し1か月半程度のWebエンジニアで、テストコードも数えるほどしか書いたことがないという人間です。
しかし、概論から入りソフトウェアテストについての意識づけ、具体的なフレームワークを利用しての実演と順序立てて聞けたため、非常にためになりました。
(テストコードを書くのは怖くないんだ……)と意識に変化をもたらしてくれたことが、今回の勉強会に参加しての個人的なハイライトです。

それでは、ひとつひとつのトーク内容について触れていきます。

トーク1: Web開発におけるテスト戦略

用語の整理から始まり、なぜテストを書いた方が良いのか、良いテストとは何か、そしてRubyでのコード例を出しながらコード設計について聞けるトークでした。
ソフトウェアテストについて概論を理解できる、そんな内容になっております。

個人的に印象に残った点を3つほど。

  • テストを書いて何が嬉しいのか
    • バグが減少する
    • 安心感がある
    • そして、開発者の幸福!
  • テストは期間を経れば経るほど価値が高まっていく
  • テストコードを書くことは、設計をすることと同義である
    • テストが複雑になるということは、プロダクションコードの設計が良くない可能性

トーク2: JestとWallaby.jsで始める楽しいJavaScript testing

JestWallaby.jsを利用して、ライブコーディングをしていただけるトークでした。
お題は、最近話題の消費税増税に関するテスト。
ライブコーディング部分に関しては、残念ながらSpeakerDeckの資料には載っていません。(気になる方はぜひ勉強会へ!)

Wallaby.jsがとても便利で、エディタにインラインでテスト結果が表示されます。
公式サイトにて紹介されているサンプルがこちら

f:id:jalemy:20190710154521g:plain
Wallaby.js sample1

私は最近Laravel + Vue.jsという環境で開発をしていて、テストの実行中に何して待っているべきか悩んでしまうことがあるので、開発体験が一変しそうという感想を抱きました。
カバレッジがエディタ上に表示されている点も印象的です。
もちろんWallaby.js以外のテストフレームワークでもカバレッジは取れるのですが、画面を切り替えることなくシームレスに確認できる点は、非常に大きいメリットではないでしょうか。

また、Wallaby.jsではテストの実行時間もシームレスに確認できます。
どのテストがどのくらい遅いのか確認しやすいため、テストの速度改善に繋がりやすいとのこと。

f:id:jalemy:20190710154640p:plain
Wallaby.js 実行速度の確認2

LT: Canvasを使った正多面体のステレオ表示

続いてLTのレポートです。
Canvasを用いて、立体視に利用できる3Dモデルを表示するといった内容です。

私は、交差法はできるのですが、平行法ができないので立体視画像は交差法でつくっていただけると嬉しいです。
(余談ですが、交差法用につくった画像を平行法で見ると、本来浮いて見える部分が凹んで見えます。逆も然り。)

また、nCrという組み合わせの計算をする上でのアルゴリズムを紹介していただいたのですが、自身の名前がついて 入山のアルゴリズム と呼ばれていることも印象的でした。

LT: US.pycon 2019参加レポート

最後にPython ConferenceのUS版に参加してきたという内容のLTです。
なかなか大規模なConferenceイベントに参加する機会はないので、その様子をうかがえる貴重なLTでした。

PyConにてさまざまなノベルティグッズが配布されていたようなのですが、Tシャツが数多く配られていたという点がおもしろかったです。
Tシャツを30枚近く手に入れたとのことなので、US.PyConに参加すれば1か月分の衣服を手に入れられるということに……

残念ながらLT資料は公開されていなかったため、割愛します。

Tips

ここでちょっとした小話として、今回登壇していただいた大倉雅史さん(@okuramasafumi)とのエピソードを紹介します。


先月5月には、ゆるはち.it【Webデザインの現場について】という勉強会を開催しました。
このWebデザイン勉強会に参加していただいたのが、大倉さんとのはじめての出会いです。

f:id:jalemy:20190711133233j:plain
大倉雅史さん

大倉「Twitterで見かけて参加した。
   八王子でこういうコミュニティを続けているのはすごい!ぜひ続けて欲しい」

と言っていただきました!
運営陣としてはとても嬉しいお言葉です……感謝感激

勉強会の最後に来月のテーマについて軽く話しているのですが、次回のテーマがWebテストについてだったので、

大倉「俺喋れますよ!」

と声を挙げていただいたため、今回の登壇に至りました。

こういった新たな出会いや、繋がりができることも勉強会の良さだと感じています。
出会いが欲しい方はぜひご参加を (露骨な宣伝)

大倉さんは、Rubyに関連するコミュニティで積極的に活動しており、自身でもGrow.rbというコミュニティを主催しております。
興味がある方はぜひ参加してみてください!

growrb.doorkeeper.jp

また、大倉さんはVimmerなので、エディタはVimに限るという方がいらっしゃいましたらぜひ。
(私はVimは挫折してVSCodeに移りました)

次回告知

次回のゆるはち.itでは、最近改めて注目を集めている「スプレッドシート」に関する勉強会を行います。
開催日程は、7/31(水)です。

トーク、LTともに登壇者を募集しておりますので、興味のある方はぜひ申し込んでください!
もちろん聞く人枠でのご参加も募集しております。 ぜひぜひお気軽にお越しください。

connpassページはこちらです。

yuruhachi-it.connpass.com

おわりに

ビルディットでは、「つくることで生きていきたい」クリエイターを募集しております。
毎月勉強会も行なっておりますので、新しい技術に関心のある方はぜひお気軽にご連絡ください。

bldt.jp

デザイナーのキャリアを、どう進み、どう育むか - デザイン顧問招聘記念対談レポート(2)

広報の大木です。前半記事 では、 イシジマミキ(デザイン顧問)、 石崎 (リードデザイナー id:uniq )ら、活躍する二人のデザイナーの「これまで」を皮切りに、ターニングポイントの選択、どんなことを考えてキャリアを進めてきたかを聞きながら、デザイナーのキャリアの構造をお聞きしてきました。後半は、多様化するデザイナーのキャリアの「これから」についてお届けします。

前半記事をお読みでない方は、先にこちらをお読みください。

inside.bldt.jp

目次

何を手がかりに自分の進む道を考えたらいい?

──前回は、「デザイナーのキャリアは階層構造ではない」「職域をどのように考えていけば良いのか?」といったお話をうかがいました。

イシジマ ですね。スキルをタイルに見立てて自身がどの分野にスキルが集中しているのか、とかですね。

f:id:miyakmakij:20190617161601p:plain
前回の記事より

石崎 タイルにしてみることで、職域とデザイン領域を俯瞰して地図のようにしよう。という話でしたね。こうして見ると、デザイン領域はどんどん広がってきているし、デザイナーの役割も多様化して迷いやすいかもしれませんね。

多様化の実態

── なるほど、多様化ですか。お二人は多様化をどのような時に感じますか?

イシジマ 身近で感じるものとしてはデザイナー同士のコミュニティですね。

以前はデザイナー向けの勉強会などで話題にあがる悩みごとなんかは大体同じようなものでした。Photoshopがどうとか、コーディングでどうとか。でも少し前から アプリとWebとで話が通じなくなり、グラフィックデザインとUIデザインでもまた話題が異なり... 。さらには「組織のデザイン」としてチームの作り方やコミュニケーションなどの 概念的なものを主軸とするデザイナー も増えてきました。 「デザイナーってこうだよね」という話が通じなくなってきた ように感じます。

石崎 私は現場でも感じます。

モノの普及でユーザーの行動範囲が広がり、技術的進歩でできることが広がり、それによってスピードを求められるようになりました。説得力のあるUIデザインを設計するには、いわゆる 「デザインを作る」前後の文脈をしっかりキャッチアップしていくことが理想的 ですし、さまざまな職種の方との コミュニケーションの溝を埋めていく工夫が必要になってきている ように思います。

自分の「興味」を信じる

──なるほど。それでも、既にデザイナーとしてのキャリアをある程度持っている人は、それまでの経験が自分が進むべき選択肢の手がかりになりそうですね。一方で、それまでのキャリアがなければ、その広い範囲の中で自分がどうすべきかというのはかなりの難問になってきているように思います。これからデザイナーを目指す方や、デザイナーになったばかりの方は、どうやって地図上に目的地を置いたり、進む道を決めたりすれば良いのでしょうか。

イシジマ 私は、自分の持っているスキルのタイルを確認した上で、 まずは興味のあること、やりたいことの自分の意思を信じて進んでみる 、ということで良いと思いますね。たとえば、知りたいことをネットで検索するのと同じような感じで情報から自分の進む道の正解や妥当性を得ようとしても、それはうまく行かないと思います。

それで「市場観」を得られたとしても、「市場」に自分を合わせていくと、さまざまな理由で長続きしなくなります。なので、まず自分の興味に沿って進みましょう。 市場に合わせるのは発信方法だけで良い と思います。発信をうまくできればおもしろそうな事やってるなと拾ってくれる人が現れますし、そんなに食いっぱぐれることはないと思うんですよね。

職域が一気に多様化して、最初の頃は実態も情報も思想も全てが混沌としていた時期がありましたけど、今現在は「整い始めてきている」という変革期だと捉えています。それなりに情報整備されてきてはいるけど、実態にはまだまだ自由度があり、肩書きも自分で自由に作れます。私だったら「デザインコミュニケーター」かな(笑)

自分の興味を信じて進み、それを市場に合わせて適切に発信していく、進むべき道はそこに出来ていく と思います。

他者の活動と比較する

石崎 私もイシジマさんの「自分を信じて」ということに重なりますが、 自分が何をやっていて気持ち良いか、逆に何がストレスか、そこから分析していくことから始める のが良さそうだと思っています。もしそこに「自分にしか出来ない仕事」とかの付加価値をつけたいとすれば、自分がやっていて楽しい仕事の中でも他の人とかぶりにくいものを見つけたりしても良いし、そこで他者と比較してもいいと思います。

私は他者の存在を手がかりに考えることが結構ありますね。自分の興味の方向性と似たような人を探してその人のやっていることを参考にしたり、この人とこの人の中間くらいのことを自分はやりたいなとか、自分自身を分析して、他者との比較も合わせて考えます。

ちなみに「他者」を探すのは、もっぱらネットになりますが、情報過多のネットの中で自分が欲しい情報を取捨選択するのは思いのほか難しいので、 手当たり次第に情報を拾わない ようにしています。 ツイッターやブログで、自分の方向性と親和性がある人、載せている情報が参考にしたいものが多い人に絞ってフォローしていくと、その人の周辺にいる人にも親和性を感じる人の層ができていたりします。そこから広げていく。

定期的に振り返る

──とはいえ、自分の信じた道だけを走るのは、なかなか不安なようにも思います。

イシジマ そうですね。どこかの方向に一旦進むことができたとしても、突き進むだけではなくて 定期的に振り返りをして、必要であれば軌道修正する ことも大事ですよね。

できればそれは、自分だけで内省するだけではなくて、客観的視点がある方が良いと思います。先輩や上司でも良いし、同僚でも良い。デザイナーとしての自分を知っている人が良いと思います。そして短期的なスパンで振り返りをするのが良いです。

デザイナーにとって良い成長環境って?

デザイナー育成の体系化はできるのか

──少し話題を変えますが、デザイナーのキャリアの多様化が進むなか、「成長」という側面をどのように捉えれば良いのでしょうか。どのような環境であれば、デザイナーにとって成長しやすいと言えるのでしょうか?

イシジマ 私が駆け出しデザイナーの頃は「見て覚える」という職人気質な徒弟制度が色濃くありました。 反面、 エンジニアはもともと職業の性質的にパイオニア的というか、知の共有がすごくオープンですよね 。勉強会も活発だし、体系化された育成シナリオが、わりとどこでも確立されているように思います。 それと同じような環境が、デザイナーにも出来てくるのが理想 だと思っています。

石崎 ただ、やはり一口に「育成シナリオ」と言っても難しさはありますよね。初級編からある程度まではできると思うんですが、その先かなり分岐するところをどうフォローしていけるか。フォローする側の知識や見極めのスキル、人に向き合うマインドセットなど適性がかなり求められますよね。

イシジマ そうですね。でも、シナリオの工夫と、細かく適切なチェック項目の設定で、 かなりの部分は標準化できる ようにも思っています。 もちろん組織にとっても、誰がどんなスキルを身に着けることができたか正確に把握することは、全社的なアウトプットの質の向上にも寄与すると思います。

育成にはどんな要素が必要?

石崎 では、育成のためのOJTシナリオにはどんな要素を盛り込めばいいのか、チェック項目の設定はどういうことを基準にすべきか、という話ですが、これはイシジマさんに参画してもらってからの毎週のミーティングで議論しましたね!

イシジマ 大体意見はまとまりましたよね。

- 構成要素
  - 実際のプロダクトに近似したシナリオ設定
  - 広い枠組みの中で思考できて、いくらでも失敗できる環境
  - 多面的にモニタリングできるタスクとレビューの設定

- チェック項目のポイント
  - デザインに対して、ハード面(技術・手法)とソフト面(表現・思考)の両方に対してレビューする
  - 細分化したスキル一つ一つの習熟度を可視化する
  - 「その人のデザイン」ではなく「デザイン」そのものに焦点を当てた評価指標

こうしたことを意識して組み込むことで、成長のベースである自分の得意・不得意を知ること、それの客観視ができるようになるんだと思います。

f:id:miyakmakij:20190701160911p:plain
OJTシナリオ設計中のドキュメント

自分の「不得意」を知ることは、それを克服するためじゃない

自分の弱点をどう捉えるか

──トレーニングを通して自分自身の不得意を把握できたら、それは克服できたほうが良いのでしょうか?

石崎 そうとも限らないと思います。得意・不得意の客観視で大事なのは、得意なことを知ることより、「不得意」を客観視できることに大きな意味がありますよね。不得意は弱点とも言い換えられるし、一般的には克服しないといけない「壁」と捉えられることが多いです。以前は自分自身もそう思っていたんですが、今はちょっと違うように考えてます。

私の場合、技術面よりは、コミュニケーションやマネジメントスキルでしたけど、どうにかして克服しないと…!と思いつめていた時期がありました。でもある時点で、それは 「弱点」ではなくて自分の「特徴」「キャラクター」という言葉に転換した方が良いんだ と思うようになりました。

イシジマ わかります!私も実例挙げられますよ。フリーランス1年目のとき、仕事がないと不安だし、独立したんだからデザイン以外もできるようにならないとと思って電話営業とか頑張っていたんです。しかし、電話がすごく嫌で、デザイン制作業務に集中できなくなったんですよね。

そこである時思い切って「電話持ってません」と名刺やメールの署名に記載し、クライアントさんとのやりとりから電話を外したんです。最初はワガママなデザイナーだから嫌がられるかな?と思いましたが、それでも私を活用してくださるクライアントさんが残り、お互いとても気持ち良く仕事ができたので、何を選択して何を選択しないかはとても大切だと気付きました。

石崎 分かりやすい例!

弱点を反転して、高パフォーマンスに転換する

f:id:miyakmakij:20190701145857j:plain

石崎 でもまさに、克服するよりも、その 不得意からくるストレスを取り除くことが、高いパフォーマンスを維持することに直結する んですよね。デザイナーに関しては、不得意はひっくり返して自分の個性にすることができるし、不得意を活かして生み出すものこそ良い創作ができるんじゃないかと思いますね。

イシジマ そう、そのために「不得意」を知ることが大事なんですよね。

ただし、その場合でも客観視も忘れてはいけなくて、弱点を取り除いて心地よく仕事が出来ているか、好きな仕事になっているか、そしてそれがKPIに結びついて良い結果を出すことができているか、そういういろんな角度からの振り返りをすることで、自分のやり方が適切なのか確認することができて、バランスの良い成長に繋がるんだと思っています。

「ビルディットのデザイナー」のブランドプロミス

成長の先に約束するもの

──そろそろまとめに入りつつ、この対談を通して、会社の紹介もしていきたいのですが...笑 デザイナーとしてどんな職域を持つかというのは人それぞれだと思いますが、ビルディットで働くデザイナーの視点から、成長の先に約束できるものって何でしょうか。

石崎 デザイナーでありながらエンジニアのカルチャーも理解できて、その中で自分の価値観を表現できるデザイナーになれること!ですかね。

私はいつも、 「デザイナー」と「エンジニア」の対話の質を高めること、が大事 だと思っています。「対話の質を高める」には…、お互いの共通言語・共通認識がいくつか確立されている状態が良くて、それは技術的な知識のものであったり、マインド上のものであったり。

デザインって、ユーザーにある価値を届けることだけれども、それをやるには一人では難しく、エンジニアとお互いの価値観を認めながら協働して、さらに周囲の関係者を巻き込んでいきたいと思っています。その考え方は、どんな領域のデザイナーにも共通して持っていたら得になるものだし、後輩として入ってくださる方には是非共有していきたいです。

今、イシジマさんとOJTシナリオの評価項目を作り始めているところですが、とても実践的ですぐにでも実務に生かすことができる、押さえるべきポイントがすごく的確な良いものになりそうだとワクワクしています。自分がやってみたいくらい笑

イシジマ しかもそれは一律ではなくて、会社にジョインしてくれた人が自分でシナリオを選んで、目標を設定することができる。そして定期的なレビューを入れる仕組みもある。これがうまく運用できれば、成果がわかりづらい「デザインのマネジメント」に関してもすごく有益な手がかりができそうですよね。

2,3年先に見えるもの

──いわゆる育成期間というものの先は、どんな姿がありますか?

石崎 成長すると視野が広がっていきますよね。

設定した目標をクリアしたら次の目標がどんどん生まれてくるのが、デザイナーという職業を続けていく上で理想的だと思っています。ただその結果外に目標や目的が見つかることもあると思います。

そういうことについてはビルディットはとても許容的ですね。代表の富田さんもよく言っていますが、 会社とフリーランスとコワーキングスペースのような人が集まる場所、それぞれの良いところを持ち合わせたような会社でありたい と。それでいてフリーでいるよりも居心地の良い、良い仕事ができて魅力がある会社でいれば良いと考えているので、その人が目標に向かって進むことについては全面的に応援するスタンスがあると思います。

そういう意味で、自分が進みたい方向や思考に従って採れる選択肢は本当に広いし、しかもどの道に進むとしてもビルディットでの経験は有効に活かせるものになると思います。

職種間の文化の融合

──今回イシジマさんと取り組んでいるミッションの一つに、「デザイナーの文化の醸成」ということがありますが、それはつまりどういうことですか?

石崎 私自身がそうありたいデザイナーの役割として、チームメンバーを良い流れの中に巻き込む力で、組織を健全に促進させる存在になることができる、そして自分自身もメンバーの活動に柔軟に巻き込まれることで相互に促進し合える組織に成長できる、これがデザイナーならではのマインド、文化だと思うんですね。いろんな人の良いところを引き出して物事を前進させるというような。

エンジニアの文化というのは、イシジマさんも先ほど言ったパイオニア的なマインドセットというのと、議論でもコミュニケーションでも効率的にしたい指向性があると思うんですが、そこにデザイナー的な文化が融合することで、 「成長」や「向上」に向けて相互促進的に前進する空気の中に、メンバー全員が参加できる、そんな組織ができるんじゃないか と思っています。

──なるほど、キレイにまとまりました!ありがとうございました!


最初に持っていてほしいのは、「好奇心」

さて、二部構成でお届けしてきたデザイナーお二人の対談はいかがでしたか?ビルディットのメンバーは、デザイナーもエンジニアも「つくることが楽しい。つくることに集中したい」という共通のマインドセットを持っています。

  • なんで、こうなってるんだろう?
  • こうやったら、どうなるだろう?
  • もっとうまくやる方法はないかな?

そんな徹底した「つくることへの好奇心」が、職種の壁を超えて最適なサービスを創り出すための共通言語となります。だからこそ、新しくメンバーになってくれる人にもこの感覚を求めていきたいと思っています。

自分のキャリアや方向性について、それが正しいかどうか確証を持っている人は少ないでしょう、だからこそ新しいキャリアに挑戦するときの不安や劣等感などそれは誰しもが持っていていることですが、好奇心に素直になって自分が作ること・ものに夢中になることで、ビルディットでの世界は大きく拓け、成長できると思っています。ぜひ溢れる好奇心を持ってきてください。

ビルディットでは、作ることに向き合って挑戦したい人を求めています!私たちと働くことに興味を持っていただけたなら、下記のサイトからお気軽にご連絡ください。

f:id:miyakmakij:20190701152951j:plain

bldt.jp

デザイナーのキャリアの、これまでとこれから - デザイン顧問招聘記念対談レポート(1)

こんにちは。広報の大木です。

ビルディットは、今年2019年4月からデザイン顧問として、イシジマミキさん(以下、敬称略)に参画いただきました。デザイン顧問を迎えるにあたって、目指したことは以下のようなことです。

  • 社内のデザイナー育成・成長のための最適な環境と土台作り
  • 社内にデザイナーならではの視点や文化をより大きく育てる
  • 制作物・成果物に対する、デザイン力・デザイン品質の強化
  • デザイナーとエンジニアの文化融合による、より高い付加価値の追求

現在進行中のイシジマとの取り組みは、弊社リードデザイナーの石崎( id:uniq )と共に、デザイナー育成のOJTシナリオの設計と運用。若手デザイナーでこれからUI/UXデザイナーとして成長していきたいと思っている方にはワクワクするような充実した内容に仕上がってきています!

今回はそんな二人のシニアデザイナーの対談リポート。二人のプロフィールは後述しますが、二人とも現役のデザイナーでありながら、いわゆる専門職としての一般的な興味領域から突き抜けた、教育や組織・社会へのインパクトといった志向を持っているよう。そんな二人のこれまでの来し方行く末について話を聞きながら、「デザイナーの成長とはどんなことか」「それぞれが思う方向に成長を促せる場とはどんなものか」などを考えていきたいと思います。

二人のキャラも内容も濃密なため、ブログは二部構成でお送りします。
今まさにデザイナーとして職域をどう広げていくかを考えている方々へ、答えを見つける一助になれば嬉しく思います。

 

目次

 

f:id:miyakmakij:20190617143047j:plain

左:イシジマミキ 右:石崎

二人のデザイナーのキャリア年表

まずは、イシジマと石崎ふたりのデザイナーがどのようなキャリアを歩んできたかをざっと紹介します。 

イシジマ history

f:id:miyakmakij:20190617144552p:plain

  • 地元の栃木でキャリアスタート。高校の授業でのHP制作体験をきっかけにデザイナーを志望。しかしはじめは自分がなりたいデザイナーが、どこで何のデザインをする人なのか、というデザイナーの職業定義や種類がよくわかっておらず、分からないままいろんなところを試行錯誤で転々としながら働いた。
  • 一つ目のターニングポイントは宇都宮のベンチャー企業。デザインだけでなく、会社の事業運営や企画、営業的なことなど全般にやった。
  • 二つ目のターニングポイントは東京での仕事の始まりと、Twitterで広がった世界。勉強会参加で人脈やデザイン業界の職域を一気に広がった。

 

石崎 history

f:id:miyakmakij:20190617144853p:plain

  • 大学から始めたミツエーリンクスでのアルバイト。デザイン・マークアップを担当。コーディング規約がとても厳密で、また社内教育も熱心な環境。W3Cに準拠したマークアップや配色デザインなどについてきちんとした知識が身につけられた。
  • 卒業後、一度は夢であった漫画家になる。当時Web業界の友人の間で流行り始めていたTwitterをはじめる。そこで再びWebデザイン業界と接点を持ち、改めて興味を持って就職。デザイナーとして就職したドワンゴで、デザインだけでなくもっと一貫してサービス開発に携わることに興味が広がり、ドワンゴモバイルでのエンジニアチーム内のデザイナー職など、興味の方向に沿って進むことが適った。
  • その後も、「もっとこれをやってみたい」「やったことがないこれも経験したい」と興味を持った方向に進んできたところ、コーディングに強いデザイナー職に着地。  

以上、まとめると、二人のデザイナーの歩んできた道のりの違いは、以下のようになります。

イシジマ
グラフィックデザイナー、Webデザイナー、UIデザイナー、組織デザイン、起業、デザイナーの教育事業へ。

石崎
Webデザイナー、UIデザイナー、リーダーやプロダクトマネージャーへ。

 

それでは、ここからは、二人の対話形式で、お送りします!どうぞお楽しみください。


何を・どんなキャリアを目指してきたの? 

イシジマ  私が突き動かされてきた行動原理は2つ。

  1. 自分に無理なく楽しく仕事をしたい!ハードワークになりすぎないにはどうしたら良いかな
  2. 自分ならではの価値で仕事したい。わたしがデザイナーとして世の中に提供できる価値は何だろう

そんなことを考えながら、最初のうちは「デザインマネジメント」、カッコ良さそう!やりたい!とか直感的&能動的に動いてはきたけれど、実際のところその部分でかなり遠回りになりましたねぇ。

目指したいロールモデルがなく、デザイナーの職域や区分もちゃんと理解していない中で、ピラミッドの底辺から上に上り詰めるような階層構造になっていると思っていたんですよね。だからとにかく今やっていることをもっとレベルアップしていけばデザイナーのトップにいけるのかと。その認識がどうやら違いそうだぞっていうことに気付くまでにはだいぶかかりました(笑)当時、自分のロールモデルになるような人が身近にいたらな、とは思いますね。


石崎 冒頭の話と重なりますが、わたしの場合ベースは一つで、自分が関わるプロダクトの開発全体をもっとよく把握・理解したいということ、なぜかというとそのプロダクトがどういう人の何に価値があるのかという本質をしっかり捉えてデザインするのが自分のモチベーションだからですかね。

だから実装のところで手離れしてしまって、自分の思惑とは違う実装になってしまうというようなことがあると残念なんです。自分の思い通りにしたいというわけではなくて、最終的なところまで見届けたいという感じです。

そういうことを突き詰めて考えると、漫画を描くときの目的意識とすごく近いんだと思います。原点回帰。読み手を飽きさせない仕掛け、物語にハマっていく仕掛けを作ることが、UI/UX周りの「ユーザーにこう感じてほしいのでこういう仕掛けを作ろう」とリンクするのかなあと。

あ、でも私もイシジマさんと同じ、ある時までデザイナーのキャリアって階層構造だと思っていました!だから仕事の範囲をもっと広げようとすると、結局は事業を作る人になるしかないのかなと思って大変な思いをしたことも。
でもやはり今は、上からじゃなくてもっと違う方向からのアクションもあるんだと分かってきましたね。


階層構造じゃないデザイナーのキャリア。では何構造?

 

イシジマ もともとイメージしていた階層構造っていうのは例えばこんな感じです。

f:id:miyakmakij:20190617161511p:plain

このピラミッド的なイメージも完全に間違いではないけど、下の段のスキルを磨くことが上の段にいく術ではないってことです。逆にいえば、グラフィックデザイナーの経験がなくても最高ブランド責任者になることは可能なんですよね。

いまの時代、デザイナーのキャリアはものすごく多様化していて、進みたい方向によって身に着けるべきスキルは千差万別になっています。私が考えるいまの時代のキャリア構造はこんな感じです。

(*下の図のタイルに入っているスキル名称や並び順は正確なものではありません。イメージとして捉えてください)

f:id:miyakmakij:20190617161601p:plain

こんなふうに、一つひとつのスキルのタイルが連なった状態をイメージします。
そしてこれはデザイナーの職務領域マップみたいなもの。

デザイナーのキャリアの出発地点ではこの中の2つか3つくらいのタイルしか持っていないですよね。そこから実務を通してある程度は自然とタイルの範囲は広がっていき、更に自主的に勉強したりすることによって領域は広がっていきます。タイルが密集しているエリアが自分の得意領域であり、今自分がいる位置。

階層構造ではないというのは、スキルとスキル同士は上位互換の関係ではないものがほとんどで、一つのスキルだけを高めたからといって他のスキルの互換性はないということです。

例えば、将来的にブランディングの方面で活躍したいのに下積みだと思ってグラフィックを一生懸命やるのは、無駄とまでは言わないけど、他の近道がいくらでもあるってこと。ちなみにその例は私のことですけどね(笑)

私の場合、理由はミーハーでしたけど、デザインのマネジメントがやりたいという目標があって、それならマネジメントのスキルを身に着ける努力をすべきでした。でもそんなこと全然思いつきもしないで、とにかくデザイナーとしての表現力とか技術力を磨いていけばそのうち自然とマネジメントへの扉が開くと思っていました。いつ開くのかな〜?って。

デザイナーとして活躍できるフィールドを広げていくには、上層に行く、ではなくて、スキルのタイルを広げていくイメージを持つことだと今は考えています。
もし最初からなりたいデザイナー像があるなら、そのデザイナーはマップ上のどの辺り・方面のスキルを持っているのかを考えて、自分のスキル群・立ち位置と見比べて、補足していくべきタイルを追っていけば良い。進んで行くべき道筋を考えるという感じです。

次にどのスキルを学べば良いかわからなくなったら、自分の持っているタイルから近いところから埋めていくことで得意分野をより強くしたり、進むべき領域の検討をつけたりしても良いと思います。

職域は広げていかないといけないもの?

石崎 いろいろハードル上がりそうなことを言ってしまいましたけど、デザイナーになりたいと思って勉強している段階では、とにかくデザイナーになること自体が目標でその先まで具体的には考えられていないかもしれないですよね。
そもそも「デザイナーになる」がゴールという場合もありそうです。

イシジマ 当時の自分を振り返ってもそれはそうですよね。でもデザイナーという職業って、同じような技術だけを一生懸命磨こうとしたら、同じような職能であふれて差別化できなくなってしまうんですよね。そうなってしまったらデザイナーという職業はすでに飽和してしまっているんじゃないかな。

私個人の事ですが、性格や趣味、学生時代に好きだったもの。そういう自身の個性を活用した方がデザイナーとしても活きるなと思っています。
例えば、犬が好きとか、音楽をやっているとか、人と話すのが好きとか苦手とか。そういう個人の個性が、携わるプロダクトにも表現された方が、好きですね。とくに表現では重要だと思っています。

例えば人を育てるのが好きだから、人事×デザインとか、数字をみるのが好きだから経理×デザインができるとどんな新しい事ができるのかワクワクしますよね。
さらにその領域でまた、自分の知らないものに興味が持てればまた新しい事を学べるし、それが次の糧となる。それを繰り返すことが生きることと同じ意味を持つんだなと。

大きく言いましたが(笑)まとめると、デザイナーとして長く活躍するには、職務領域のタイルを自分らしく一つ一つ埋めていった方がいい。そして、自分の立ち位置、到達したいゴールの位置、そこまでの道筋のイメージをそのマップ上に描く。その3点を意識することで、目標までの道のりがグッと近くに、そして充実すると思います。
 

石崎 地図上の3点のイメージ、私もしっくりきます。…でも目指す方向や目標って、すぐ目の前に現れたりしない場合も多そうです。

それと「この人のようになりたい!」と思っても自分にその人と同じような適性があるかどうかも分からない、といった不安も生まれそう。

次は、自分が進むべき道筋の考え方と、壁を感じたときにどう乗り越えて進むか?という話をしましょうか。


対談の続きは、次回の記事で紹介していきます。

お楽しみに!

f:id:miyakmakij:20190617163423j:plain

 

bldt.jp

株式会社ビルディットの採用サイトをつくった話。

はじめまして。八王子のIT企業・株式会社ビルディットの大木です。記念すべき令和が始まった5月1日に入社しました。

前職は医療分野に特化したコンサルティング会社で10年ほど人事採用をやっていました。IT業界は全くの未経験でして、これからいろいろ学習していきたいと思っています。

近々にビルディットにご応募をお考えの方には不慣れな対応があるかもしれませんが、来年にせまる東京オリンピックに倣い、まずはおもてなしの心を胸に刻んで参ります。どうぞよろしくお願いいたします。

 

f:id:miyakmakij:20190517162753j:plain

入社の経緯 ビルディットとの出会い

ビルディットとの出会いは昨年秋でした。

私には小学生と保育園の子供がおり、そして前職の会社までは1時間半強の長時間通勤でした。前職の社内環境はとても良く、自分の好きな仕事でもあり、時短勤務の割りにはやりがいも担保されてはいたものの、1日の3時間以上が通勤に割かれること、子供がいるので朝家を出る時間・帰宅する時間の制限もあり、必然的に仕事に当てられる時間がその分逼迫されることなどから、八王子の自宅近くでもチャレンジングで面白い仕事があればなぁ‥と思っていました。 

ごくたまに求人サイトで八王子で検索する程度のゆるゆるとした転職活動をしていた中で、ふと目に留まったのが「小さなチームの広報をお願いします」という広告コピー。

詳細を開いてみると、「小さなチーム」が表すように、数人の規模と思われる小規模なベンチャー企業で、それがビルディットでした。

画像から見えた数人の会社という設定から、アットホームを通り越した内輪感があるようなイメージを一瞬想像しましたが、募集要項の説明文を読むと、思いのほかしっかりとした分かりやすい文章で会社の価値観や仕事の説明などが書かれていました。

繊細な言葉の選び方・表現の仕方からは、外部の人に自社を理解してほしいという強い意思を感じ、そこに意外さと、文章表現の力を信じて今までやってきた自分との親和性を感じたのをはっきり覚えています。

 

つくり手が幸せな会社。であるために

何度かのカジュアルな面談やトライアルを通して更に感じたことは、自分が理想と思う会社環境のイメージから、ビルディットはそこからさらに一歩先に進んだところにあるようだということでした。

ミッションに対して自分の頭で考え抜くこと、固定的な手法でなくトライアンドエラーすることに寛容的であること、責任の範囲がとても広いこと、それでいてお互い干渉しないようなドライな関係ではなく、あくまでチームワークは大切にしていて、技術や知識の共有などには積極的という面のバランスがとても良いと感じました。

「一歩先」だと感じた理由は、上記に書いた会社の指針一つひとつが研ぎ澄まされていて、それらは魅力的であると同時に、常に自律的なスタンスが不可欠だと思ったからです。

 ビルディットのHPサイトに標榜している「切磋琢磨できる環境」というのは、成長できる環境があると同時に、自分自身がまず自らを磨き続けることが前提となってきます。

常に試されている感覚があるのかもしれない、、という難しさも感じましたが、会うメンバーの方々が非ITの私に対してもあくまで親切に友好的に対応してくれる様子に飛び込んでみようと決めました。

 

ビルディット採用サイト launch!

前職の退職時期の兼ね合いもありビルディットへの入社は5月となりましたが、今年の年始あたりから週1回ほど会社にきて、まずは自社「採用サイト」の新設から携わられていただきました。

それまで採用関連の問い合せフォームも兼ねていたビルディットのコーポレートサイトは、たしかに採用的に見てもビルディットの魅力を打ち出すワードや文章が並んでいましたが、やはり「採用を行っていること」の表明は必要だと思いました。

採用的に打ち出したい事、会社全体としての情報と分けてしっかり発信していくために、まずは採用サイトを作りました。

サイトのデザインはリードデザイナーのuniqさんが他案件で多忙な中で担当してくれました。

前職までにも採用サイトや関連サイトの新設は何度か経験がありましたが、デザイナーさんと直でやりとりをしたことはなく勝手も分からず、「こういうふうにしたい」というイメージがものすごく抽象的だったり逆に具体的過ぎたり、構成の草案に客観的な筋道がなかったりと、uniqさんには多大な手間をおかけしてしまいました。

そんな拙いディレクションでしたが、制作過程でビジュアルを見せてもらうと会社のイメージがばっちり表現されていて、アノ構成案からコレが出来るなんて、デザイナーさんってスゴイ、、とただただ感激しました。

 

そんなこんなでlaunchした採用サイトです。

https://bldt.jp/recruit/recruit.html

 

私がこれからビルディットでやりたいこと

ビルディットのエンジニア・デザイナーのメンバーの多くが、ビルディットに参画したことのきっかけの一つと語ったブログを紹介します。

 

medium.com

medium.com

 

ビルディットの中に入って感じたのは、代表の富田さんが技術者として積み上げてきた技術力やマネジメントも含めた総合的な職能力や、そこから創り上げられた価値観に、メンバーの一人ひとりがそれぞれの立場でそれぞれに共鳴しているのだなということでした。

共感の仕方やポイント、範囲や深さなどはそれぞれ違いはあっても、間違いなくどこかの部分で全員が繋がっている、それを日々感じます。

 その共鳴ポイントが上記2つのブログに集合しているように思うので、ビルディットにご興味をお持ち下さった方にもぜひ読んでいただきたいと思っています。

私はIT業界の知見も技術者の経験も全く無いので、専門的な技術の話は語ることはできないし、「つくること」そのものに強くこだわりたいという肌感覚はそこまで持っていないと自覚しています。

しかしビルディットのようなチームの在り方に私は深い共感を覚えます。そのチームの一員として、チームが持つ価値を波及していくことが自分の仕事だと考えています。

ビルディットという会社組織がメンバーに対してどんな価値を提供しているのか、メンバーがビルディットにたいして供与するものは何か、そしてそれらが社会そのものに与えるインパクトは何か、そんなことを語れることをまずは目標にしたいと思っています。

これから、どうぞよろしくお願いいたします。

f:id:miyakmakij:20190517162901j:plain

 

 

大木 まきこ

f:id:miyakmakij:20190520105253j:plain