UI/UX

ソフトウェアエンジニアと UI デザイナーが Apple の Human Interface Guidelines を一緒に読んだら

とても良い感じです。 はじめまして、アンドパッドで iOS アプリ開発を担当している西 @jrsaruo_tech です。 最初は Swift の好きなところを30個挙げる記事を書こうと思ったのですが、誰が読むんだろうと冷静になれたので猫をかぶることにしました。Swift の…

ANDPAD のデザインシステム「Tsukuri」の Web 向け実装について - 現状と今後

1. はじめに Web フロントエンド開発を中心に行っている寺島です。 この記事はアンドパッドで開発しているデザインシステム 『Tsukuri』 の Web 向け実装である『Tsukuri for Web』の構築について紹介する最後の記事です。 tech.andpad.co.jp tech.andpad.co…

ANDPAD のデザインシステム 「Tsukuri」 の Web 向け実装について - リポジトリの構成・開発ツール

1. はじめに 2. リポジトリ全体に関して 2.1. ディレクトリの構造 2.2. パッケージマネージャ 2.3. Node.js 2.4. スキャッフォールディングツール 2.5. そのほかの モノレポツール 3. ビルド・バンドルツールに関して 4. ドキュメンテーションに関して 5. テ…

ANDPAD のデザインシステム「Tsukuri」の Web 向け実装について - UI コンポーネントの開発

この記事の概要 Lit を用いて Web Component を実装しています Custom Element Manifest の情報を元に Vue や React のコンポーネントを機械的に実装しています デザイナーと開発者がデザインシステムの語彙を用いてコミュニケーションを取りやすいような設…

ANDPAD のデザインシステム 「Tsukuri」 の Web 向け実装について - 方針と全体像の紹介

この記事の概要 デザインシステム 『Tsukuri』の Web 向け実装『Tsukuri for Web』を開発中です 変更しやすくするために構成要素の依存関係を考慮した構造を検討しました コンポーネントの実装は Web Component を利用し、Vue.js と React にも対応します ア…

Figma Organization Planでデザイン🎨しよう!(セキュリティ編)

こんにちは、7月に入社したUIデザイナーのよつくらです。 ANDPADではすべてのプロダクトで、UIデザインツールとしてFigmaを採用しています。ANDPADのセキュリティ強化の一環として8月頭にFigma Organization Planを検討しはじめ、8月下旬には導入できました…

認証機能追加を、ユーザーストーリーマッピング的なもので整理してみた!

はじめに 初めまして!オクト デザインチームの小久保です。 普段は、グラフィックデザイン(パンフレットなど、主に紙の制作物)からUIデザインまで、幅広くデザインに携わっています。 その中でもUIデザインは、ユーザーがやりたいことを、ストレスなく達…

オクトのデザインチームを紹介するよ!

はじめに 初めましてデザインチームの杉本です。 オクトのデザイナーとして初めて書くことになったので、デザインチームの紹介をしていこうと思います。 デザインチームについて デザイナーて何人います? 現在8人です。 1年前に3人でオクトのデザイン業務…