osanai / ui designer

株式会社カンムでデザイナーをやっております。

osanai / ui designer

株式会社カンムでデザイナーをやっております。

  • Kanmu メンバーマガジン

    • 69本

    カンムメンバーの note マガジンです

デザイナーやエンジニアの作業効率が向上するFigmaの運用方法を考える

カンムでプロダクトデザインをしている osanai です。こんにちは。 前回ご紹介したコンポーネント品評会により、デザインシステムにおけるコンポーネントの課題について議論が進み、不必要なコンポーネントが生まれにくくなり、デザインの意図が汲み取りやすくなりました。 品評会をしていると、しばしばデザイナーとエンジニアで「Figma でもっと効率よくできないかな」という話題が出てきます。例えば「コンポーネントの Variants のパターンをパット見で把握したい」「目的のページ

osanai / ui…

    • エンジニアとデザイナーのコンポーネント品評会

      カンムでデザイナーをしている osanai です。バンドルカードやPoolのデザインを担当しております。 アプリの改善を長年やっていると、デザインにおける一貫性の欠如が発生しがちです。意味合いは同じなのに画面ごとに色やサイズや異なっていたり、用途は同じなのに類似したデザインパターンが複数存在していたり、古いUIが一部の画面で残されたままになっていたり。 このような一貫性の欠如はデザイン負債とも呼ばれ、蓄積するとさまざまな運用コストが発生します。デザインパターンを適用すると

      osanai / ui…

      • デザインの言語化：客観的事実を根拠にデザインを伝える

        12月です。年末です。カンムアドベントカレンダー10日目の記事です 📆 カンムのデザイナーosanaiです。 今年、自分の中で最も盛り上がった漫画の1つは、アオアシです。「つつつつつ、つつつ、掴っ…掴っっつかっつかっ掴っ掴…、つ か ん だ」ってやつです。 掴んだって言っても手を使えないサッカーの話なんですが、主人公のアシトが試合を通じてどんどんサッカーのコツを掴んでいくんですね。 コツを掴む前のアシトが言った、印象に残ったセリフがこれ。 「何かをつかみかけているあの

        osanai / ui…

        • 何も意識せずにできるデザインレビュー

          カンムでデザインをしているosanaiです。 あるときデザインレビューの方法について調べていたんです。「デザインレビューで意識する○つのこと」や「デザインレビューするときに心がけていること」といった記事はとても参考になります。 一方で、デザイナー以外の方々にもアプリやLP（ウェブサイト）のデザインをレビューしてもらうことがあり、「意識すること」を事前にお伝えしなくても済むように「何も意識せずに」レビューできるとより良さそうと思いました。 そこで今回は「デザインレビューシ

          osanai / ui…

        マガジン

        • Kanmu メンバーマガジン
          69本

        記事

          新しいプロダクトをゼロからデザインする ─ Poolのブランド構築

          弊社カンムは投資と決済を掛け合わせた新プロダクト「Pool」をリリースする予定です。 「心理的unbankedをソフトウェアで解決する」というミッションのもと、投資に対する面倒・難しい・怖い・不安といった心理的ハードルを下げたいと考えています。Poolは投資が今よりも資産形成に活用しやすくなることを目指したサービスです。 この記事ではPoolのデザイン過程を紹介しつつ、カンムの新たなチャレンジについてデザイナーの立場からお話します。（開発中のため、機能に関する具体的な情報

          osanai / ui…

          新しいプロダクトをゼロからデザインする ─ Poolのブランド構築

          osanai / ui designer

          IllustratorとCSVで大量の名刺データを素早く編集する！

          デザイナーのみなさん、自社の名刺の入稿データってどう管理してますか？ ぼくはデザインデータ（.ai）とテキストデータ（.csv）に分けて管理しています。 最初はデザインデータだけで管理していたんです。というのも2018年にぼくがカンムに入社したときの社員数は十数名で、名刺のデザイン修正時には十数個のデータを修正するだけで済んでいたので、少し手間だったけど数年に1回の頻度だったら「まあいっか」と。 ところが2020年は社員数が30人以上になりまして、ここまで増えると全員分の

          osanai / ui…

          IllustratorとCSVで大量の名刺データを素早く編集する！

          osanai / ui designer

          オブジェクト指向UIデザインのトレーニング ─ バンドルカード篇

          2020年6月に書籍「オブジェクト指向UIデザイン」がソシオメディアさんから出版されました。UIデザイン界隈で「OOUI（object-oriented user interface）」って言葉やその手法に関する考察が note や SNS を通じて盛んに飛び交いましたね。 けど、海外の開発者の間では OOUI の概念が1980年代からすでに広まっていたってご存知でしたか 👀 。 30年以上前から OOUI に関する英語の書籍はあったのに、日本語の書籍がなかなかなかったんで

          osanai / ui…

          オブジェクト指向UIデザインのトレーニング ─ バンドルカード篇

          osanai / ui designer

          フォームデザインのベストプラクティスを探求する

          フォームはユーザビリティの問題を引き寄せる1万ボルトの電磁石である ── ヘイドン・ピカリング 使いづらさの問題の多くはフォームにある、とインターフェース・デザイナーのヘイドン・ピカリングさんは主張します。  アプリケーションはフォームによってユーザーと情報のやりとりができますが、体が不自由な方や高齢者など、ユーザーのあらゆる状況が考慮されていないと、一部のユーザーにとってコミュニケーション不能になってしまうことがあります。 だれにとっても使いやすいフォームをデザインす

          osanai / ui…

          フォームデザインのベストプラクティスを探求する

          osanai / ui designer

          UIデザインの計測と学習 〜登録率の改善〜

          「推測するな、計測せよ」 ソフトウェア工学者のロブ・パイク氏による、パフォーマンス最適化についての格言だそうです。これはUIデザイン改善にもあてはまる言葉だと思っています。 たとえば、様々なフォームUIで採用されているフローティングラベルも一部ではアクセシビリティ上の欠点が指摘されています。流行のUIもユーザビリティが高いとは限りません。実際の効果は計測によって学習することができます。 ここではバンドルカードの登録率を改善したときのチームの取り組みについてご紹介します。

          osanai / ui…

          UIデザインの計測と学習 〜登録率の改善〜

          osanai / ui designer

          Apple ヒューマンインターフェースガイドライン輪読のすゝめ

          カンムでデザイナーやってます、小山内です。 iOSアプリ開発に携わる人のほとんどが読んでいるであろう Human Interface Guidelines、ひとりで黙読しただけで済ませていませんか？  ガイドラインを読んでプラットフォームの標準UIを把握することは、ユーザーの慣習を学ぶことでもあり、UI設計の拠り所を掴むことにつながります。 しかしチーム内でガイドラインの理解度や解釈が異なると、標準と異なっているデザインに気づけなかったり、スムーズに意思決定できなくなる

          osanai / ui…

          Apple ヒューマンインターフェースガイドライン輪読のすゝめ

          osanai / ui designer

          UIデザインで参考にするブックマーク集

          Chrome のブックマークバーが散らかってきました。Kanmu のデザイナー、小山内です。 年末だし、ここらでブックマークを整理してみようと思いまして。アプリデザインのときに参考にしているサイトをまとめてみました。 これは カンム Advent Calendar 2019 の3日目の記事です。 必要なリソースが見つかるサイトインスピレーションが得られるサイトをお探しですか？ トレンドに関する新情報をお探しですか？ それとも UI Kit？ デザインツール？ フリー素材

          osanai / ui…

          UIデザインで参考にするブックマーク集

          osanai / ui designer

          SketchとGoogleスプレッドシートを連携させてアプリの文言を管理する

          アプリのボタンの文言を決めるとき、「体言止めにする？ 動詞にする？ あれ、既存画面の文言はどうしてたっけ？」ってなるときがあります。Kanmu のデザイナー小山内です。 アプリ内文言の一覧があれば、表記ゆれに気づきやすいかなって。あわよくば、それを Sketch にシームレスに取り込めたらラクかなって。そう思っていたら、Kanmu Tech Day がやってまいりました。 Kanmu Tech Day とは テクノロジーを使って業務の効率化や、何かおもしろそうな試みをやっ

          osanai / ui…

          SketchとGoogleスプレッドシートを連携させてアプリの文言を管理する

          osanai / ui designer

          バンドルカードのロゴをリファインしたデザイナーの頭の中

          スマホから1分でVisaプリペイドがつくれるバンドルカード。 プロダクトがリリースされて2年半、ロゴが新しくなりました。 従来のロゴにどんな課題があって、改善するまでにどんな思考を経たのか、いちデザイナーの頭の中を記録として残しておきます。 機運2018年11月、ありがたいことに、とある出版社さんにムック本でバンドルカードを紹介していただきました。 内容は同年9月にリリースしたセブン銀行ATMチャージ機能について。 バンドルカードとセブン銀行ATMさんのロゴが並ぶ

          osanai / ui…

          バンドルカードのロゴをリファインしたデザイナーの頭の中

          osanai / ui designer