Hiroki Tani

Figmaやデザインシステムが好物です。 OSS: FLOCSS もっとみる

Hiroki Tani

Figmaやデザインシステムが好物です。 OSS: FLOCSS http://github.com/hiloki/flocss 著書: Web制作者のためのCSS設計の教科書 http://amzn.to/2hJcQVX

マガジン

  • #デザインシステム 記事まとめ

    • 165本

    デザインシステム関係の記事まとめ #DesignSystems #デザインシステム 運営メンバーも募集中。

  • YOWATARI RADIO

    • 5本

    YOWATARI RADIO(ヨワタリラジオ)は、デザイナーの背景を持つ器用貧乏な2人、こぎそ(@kgsi)とたに(@hiloki)が、デザイナーやエンジニアなどのキャリアや将来の展望についてゆるく語るラジオ番組です。ゲストを招いたトークを中心に不定期に収録、公開していきます。 noteには各回の要約やお知らせ、コラムなどを投稿予定です。

  • Learning English

    英語の勉強をまじめにはじめた人の記録。

  • Frontend Weekly for Designer

    国内・海外のフロントエンド関連情報を厳選し毎週お届けしている「Frontend Weekly」のデザイナー向け記事をセレクトした「For Designer Edition」をはじめます。 Design系の記事だけでなく、Webフロントエンド全般の記事を読みたい方はFrontend Weeklyをどうぞ。 Frontend Weekly https://frontendweekly.tokyo/

  • Coffee and

    Coffeeの話。

最近の記事

#7 なんでも屋x笑顔x60歳(ゲスト:宇野 雄 / さん)

こんにちはこんばんわ、YOWATARI RADIOです。 YOWATARI RADIO第7回目。今回のゲストはnote株式会社でCDOを務める宇野 雄さん(@saladdays)です。これまでのキャリアや仕事への向き合い方などを語っていただきました。 今回のエピソードの概要 現在のポジション以前のキャリアの話から、いつも笑顔の宇野さんの秘密、仕事への姿勢など、同世代のメンバー同士で盛り上がりました。金言も盛り沢山です。 告知noteさんではプロダクトデザイナーを絶賛募集

    • 初めての海外長期出張で密かに怪我をしていた話

      6月21日、22日に開催されたFigmaのカンファレンス Configの準備と参加のため、6月16日からサンフランシスコに出張にいった。 サンフランシスコ自体は3度目にはなるものの、仕事らしい仕事でいくのと、2週間近くの滞在ははじめて。 Configそのものの振り返り…もしたいところだけど、すでに現地に参加してくれていた日本人の参加者の素晴らしいレポートもあるので、ぜひそちらをみてください。 じゃあ僕はこのnoteで何を書くかというと、人生で初の「海外で怪我をして病院にい

      • 社内で見かける英語の略称

        先月から英語が公用語な会社にはいったので、日々英語と格闘しながら新しい仕事のオンボーディングをがんばっています。所属は日本のチームなので、いうてほとんどは日本語でコミュケーションはするものの、Slackやドキュメントその他の情報は英語です。 その中で今回は「略称」として見かけるもの、そして知らなかったものをあげてみます。 TILToday I Learned(今日の学び) 社内ツールの小技が共有されたとか、何かしら学びっぽいものがあったときに主にSlackのEmojiでリ

        • 今日からFigma JapanのDesigner Advocateになりました🎉

          先日3月14日に、Figma Japanの1周年記念イベントとして「デザイン経営2023」が開催され、その場で先行して発表されましたが、4月よりFigma Japanの二人目のDesigner Advocateとして入社することになりました。 Figmaとの出会いFigmaをおそらくまともに使い始めたのは2018年頃。Figmaは2016年から一般公開なので、めちゃくちゃ早いほうではないものの、当時勤めていたサイバーエージェントの中では比較的早い段階で触り始めたような記憶で

        #7 なんでも屋x笑顔x60歳(ゲスト:宇野 雄 / さん)

        マガジン

        マガジンをすべて見る すべて見る
        • #デザインシステム 記事まとめ
          NobuyaSato 他
        • YOWATARI RADIO
          こぎそ 他
        • Learning English
          Hiroki Tani
        • Frontend Weekly for Designer
          Hiroki Tani
        • Coffee and
          Hiroki Tani
        • 残していきたい
          Hiroki Tani

        記事

        記事をすべて見る すべて見る

          #3 スピード感x予測不能x成長(ゲスト:鈴木 伸緒さん)

          こんにちはこんばんわ、YOWATARI RADIOです。 YOWATARI RADIO第3回目。今回のゲストはデジタル庁で働くデザイン・マネージャーの鈴木伸緒さん(@nobgraphica)です。ご自身の成長を意識した働き方やこれまでの歩みを語ってもらいました。 今回のエピソードの概要みんなが気になるであろうデジタル庁でのお仕事の話から、さかのぼってデザイナーになった経緯や、パーソナリティのtaniとの邂逅、メルカリ時代の話などを伺っています。 参照リンク影響を受けた本

          #3 スピード感x予測不能x成長(ゲスト:鈴木 伸緒さん)

          英語の勉強のために参考にしているYouTubeチャンネル

          次の働く環境では英語も話せるようにならないといけないので、典型的な学習教材以外にも英語に関する情報を得るためにYouTubeもよく観ています。 しっかり勉強するものと、英語圏での生活におけるあるあるを交えたチャンネルや動画など様々あるんですが、よく観ているものを今回ピックアップしてみます。 あいうえおフォニックス一見こども向け風なイメージだけど、中身はしっかりリアルな英会話フレーズや発音についての動画がたくさん。MCの二人はちゃんとネイティブな感じでそこそこスピード早く英語

          英語の勉強のために参考にしているYouTubeチャンネル

          FigJamのTableをSticky notesに変換するプラグインをつくりました

          このプラグインはFigJamに新しく登場したTableをSticky notesに変えるというシンプルなプラグインです。 プラグインを作った背景たまたまTwitterを見ていたときに次のようなTweetを見かけました。 このFigJamのTableの登場によって、SpreadsheetなどのセルをコピーしてFigJamに貼り付けるとSticky notesになるという仕様が変更され、Tableになるようになりました。 そこから色々とユーザーの声を探ってみると、 という

          FigJamのTableをSticky notesに変換するプラグインをつくりました

          #2 バイブス×取捨選択×余白(ゲスト:にしゃみーさん)

          こんにちはこんばんわ、YOWATARI RADIOです。 第2回目からnoteにも抜粋した内容やラジオで出たリンクなどを投稿していきます。 ちなみにYOWATARI RADIOって何?という方は以下説明を見てね。 今回はゲストにRimoのプロダクトデザイナー・にしゃみーさん(@NishaMe1024)をお招きしてお送りします。 今回のエピソードの概要今回の内容は、にしゃみーさんがデザイナーをつとめるRimoで提供している文字起こし機能と、3/9にリリースされた要約機能を

          #2 バイブス×取捨選択×余白(ゲスト:にしゃみーさん)

          10 Days of Figma Tips: FigmaのAdvocateによる10のTips

          12月といえばアドベントカレンダーが盛んですが、FigmaからはTipsをFigmaのAdvocateの皆さんが10日間にわたって紹介するコンテンツを公開していました。 TipsはちょっとずつFigma Communityに公開され、プロトタイプでプレゼントを開封するようなアニメーションで演出しています。 中身は紹介メッセージ付きの動画になっていますが、このFigmaのプロトタイプ上でじっくりみるのは難しいので、すべてYouTubeでも公開されています。 この記事では各Ti

          10 Days of Figma Tips: FigmaのAdvocateによる10のTips

          22 ↔ 23

          2022年は「動」去年振り返ったタイミングではあんまり考えてなかったくらいに「動いた」年だったように思う。 4月にはUbieに転職し、そこから半年近くは生活者向けのプロダクトである症状検索エンジン「ユビー」のUI改善やSEO関連の開発、あとはデザインシステムの設計・開発に取り組んだ。 医療という分野は過去のキャリアでも一切経験はなかったので、学びも多いし、逆にいえばデザインや開発の難しさも感じる。ドメイン固有の難しさ、あるいは色々な事情による理不尽さに近いものは不動産領域に

          2022年買ってよかったもの

          備忘録的に雑に残しておく。 一部Amazonのリンクはアフィリエイトのリンクになってます。 アーロンチェア(ゲーミング・エディション)とうとう買ってしまったアーロンチェア。ゲーミング・エディションは通常のグレーっぽいブラック(グラファイト)ではなく、ほんとにブラックだということで選んだ。 COVID-19な時期にはいってすぐにヘルニアになってしまったくらいには腰痛がひどいので、椅子に思い切って投資。高い買い物ではあるけど、今のところ満足。 Satechiのキーボードデスク

          2022年買ってよかったもの

          コードでデザインをするということ

          この記事は2022年12月10日開催のSpectrum Tokyo Design Fest 2022で話したセッションの内容を文字起こししたものです。 僕は15年ほどWebに関する業界で働いています。はじめは小さなベンチャーでWebデザイナーとして仕事をはじめ、自分でデザインして自分でコーディングするというキャリアからはじまりました。それからフロントエンドデベロッパー、UXエンジニア、デザインエンジニアと肩書を変えてきています。 その中で、CSS設計の書籍の執筆や、Figm

          コードでデザインをするということ

          好きなデザインシステム「giffgaff design」を推してみる

          過去のnoteでもデザインシステムをピックアップしてるんですが、今回は「#このデザインが好き」というお題に乗って、いくつかの好きなデザインシステムから1つ選んでみました。 giffgaff.designgiffgaffはイギリスの通信事業者です。正直僕はgiffgaffのことは全く知らなかったんですが、デザインシステム巡りをしている中で彼らのデザインシステムを入り口にして知りました。 もうぱっと見て「好き」他社のデザインシステムと比べての第一印象として、少しアート寄りな遊

          好きなデザインシステム「giffgaff design」を推してみる

          Figmaファイルのサムネイル表示をハックする

          この記事は、Figmaを使ったコラボレーションUPの方法(社内・チーム内等)by Figma Advent Calendar 2022の12/6の記事です。 FigmaファイルのThumbnail表示はどうつくるのがいい?Figmaファイルのサムネイルというのは、ダッシュボードやプロジェクトに並べられるFigmaの各ファイルのサムネイル表示のことです。 このサムネイルの表示はひと目みて「何のファイルか」を識別するのに重要なのですが、この表示部分を上手く利用する例がいくつか

          Figmaファイルのサムネイル表示をハックする

          デザイナーになったわけ、ってなんだっけ

          ふとTwitterで「デザイナーになったわけ」というnoteの企画を見かけたので5分くらい考えてみました。  人生で唯一飽きていないこと実は過去に現在にいたるまでの話をnoteに書いたけど、この内容と違う側面から言えば、やや飽き性な自分の性格のわりには飽きていないのが「つくること」。あらゆる職種において何かしらを「つくっている」と思うけど、たまたまその中でWebサイトのデザイン、Flashバナーのデザインという入り口から現在のデジタルプロダクトのデザインをする人になりました

          デザイナーになったわけ、ってなんだっけ

          Schema by Figma 2022 東京開催を終えて

          Cover: Figma Japan Country ManagerのHiroさんのtweetより 2022年11月2日に東京・品川でSchema by Figma 2022 Tokyoが開催されました。Schemaは2021からFigmaが主催で開催されているmeetupで、今年はなんとニューヨーク・ロンドンと並んで、アジアでは東京での開催となりました。 アジア最初の拠点としてFigma Japanが設立され、こうしたイベントも日本で開催されるようになったのはとても嬉しい

          Schema by Figma 2022 東京開催を終えて