「さんち」は、日本全国の工芸と産地の魅力をお届けするWEBメディアです。工芸と探訪に関する多様な特集記事と、日本の工芸にまつわるニュース、それぞれの産地に特化した観光情報というコンテンツから成り立っています。 「さんち」とは、外から来る人にも開かれた、新しい産地の形です。作り手、使い手、伝え手が集い(三智)、モノが生まれる所に買う・食べる・泊まる所が寄り添い(三地)、その土地にしかない個性を感じられる場所。 このさんちプロジェクトが目指すのは産業観光を通して全国の産地を元気にすること。大都市だけでなく「工芸の産地」を旅し、工芸に関心を持って生活の中に取り入れてもらうことです。

活動

Interface design / Apple platforms. 🇯🇵
@usagimaruma@twitter.com / @usagimaru@mastodon.social
bento.me/usagimaru

usagimaru ⌘ (@usagimaru.bsky.social)

Cartographer Welcome Window designed by S Maru. Connect with them on Dribbble; the global community for designers and creative professionals.

Cartographer Welcome Window

S Maru | 🇯🇵 Software Designer / UI Architect / Apple Developer | Connect with them on Dribbble; the global community for designers and creative professionals.

S Maru

Interface design and development on Apple platforms. 🇯🇵 - usagimaru

usagimaru - Overview

グッドパッチでは、WWDC23で注目を集めた「Vision Pro」および「visionOS」に興味を持った有志のデザイナーやエンジニアが集まってLT会を開催しました。この記事では、LTの内容やイベントの様子をご紹介します。

Apple好きのデザイナー／エンジニアが大集合！熱すぎた「Vision Pro LT会」開催レポート｜Goodpatch Blog グッドパッチブログ

グッドパッチでは社員向けにさまざまな研修を実施しています。定期的な新入社員向けの基礎研修のほか、専門性と難度をより深めた「専門研修」を実施することがあります。この記事では、筆者usagimaruがグッドパッチのデザイナー支援組織である...

確かな情報設計力を鍛える——社内研修「UIデザイントレーニング」レポート｜Goodpatch Blog グッドパッチブログ

先日、GoodpatchはSmartHRさんのオフィスでワークショップを開催しました！OOUIの基礎知識をインプットできる座学、オブジェクトモデリングワークショップをUIデザイナー、PMの皆さんに体験していただきました。本記事では開催...

オブジェクトモデリング入門編！SmartHRでOOUIワークショップを開催しました｜Goodpatch Blog グッドパッチブログ

Goodpatchでは、クライアント様からのご相談をもとにデザインに関するセミナーやワークショップを提供しています。今回は、プリントシール機業界シェアNo.1のフリューさんと「デザインの共通認識を形作る」というテーマでセミナーを開催し...

デザインの共通認識を形作るには？フリューさんとセミナーを開催しました｜Goodpatch Blog グッドパッチブログ

Goodpatchでは、UIの構造設計を重視したデザインプロセス「モデルベースUIデザイン」を推進しています。最初にコンセプト定義やユースケースを定義し、情報整理をして最終的に機能やビジュアルなどの具体的なところを詰めていく考えをとっ...

ソフトウェアデザインにおける構造設計を実践！マネーフォワードさんとワークショップを開催しました｜Goodpatch Blog グッドパッチブログ

ユーザーインターフェイス（UI）とは、製品とユーザーとを繋ぐ架け橋になる部分です。優れたUIをデザインするということは、製品やサービスの魅力を高めることに直結します。その印象や使い勝手を良くするのはもちろんのこと、副次的には製品や会社のブランドイメージを向上させたり、競合製品との差別化を図るなど、中長期目線では製品の使い勝手のみに限定しない、より大きな効果をも期待することができるでしょう。

UIデザインとは？デザイナー監修で5つのポイントと事例を紹介｜Goodpatch Blog グッドパッチブログ

UXデザイン（ユーザーエクスペリエンス・デザイン、ユーザー体験設計）とは、ユーザーがプロダクトやサービスを利用する際の一連の体験の仕方を設計することです。
利用する前の体験から利用中の体験、利用した後の「使いやすい、分かりやすい」「心地いい・楽しい」「また使いたくなる」といった一連の体験における設計・企画がこれに当たります。
ここで言う「UX（ユーザーエクスペリエンス、ユーザー体験）」とは、ユーザー一人ひとりにとっての主観的、時間的、または状況的な側面を含む一連の体験のプロセスを指します。

UXデザインとは？UIデザインとの違いや設計プロセス、事例を紹介｜Goodpatch Blog グッドパッチブログ

2022年7月11日に、今年のWWDCで公開された内容から、選りすぐりの内容をデザインとディベロップメント双方の視点から深掘り・振り返りするイベント「WWDC22 Recap in Goodpatch」をオンラインで開催しました。Go...

WWDC22で公開された内容をソフトウェアデザインの観点から深掘り・振り返り『WWDC22 Recap in Goodpatch』｜Goodpatch Blog グッドパッチブログ

株式会社グッドパッチがデザインと開発をサポートした株式会社中川政七商店の「さんち」がグッドデザイン賞（主催：公益財団法人日本デザイン振興会）において、グッドデザイン・ベスト100を受賞しました。2017年度のグッドデザイン賞 審査対象...

中川政七商店「さんち」が2017年度グッドデザイン・ベスト100を受賞｜News｜Goodpatch グッドパッチ

株式会社ミクシィが提供する6gramは、アプリ上でカードを発行しチャージして使うグループウォレットアプリです。友人や同僚、家族とシェアして使うことができる、新しい形の決済を提案しています。Goodpatchはミクシィのデザインパートナ...

6gram｜Work｜Goodpatch グッドパッチ

テクノロジーを活用した事業やプロジェクトを通じて「納得できる医療」の実現を目指す株式会社メドレー。医療プラットフォーム事業では、日本最大級のオンライン診療システム「CLINICS オンライン診療」を中核として、スムーズなオンライン医療...

CLINICS｜Work｜Goodpatch グッドパッチ

エンジニアプラットフォームを提供するファインディ株式会社に対し、グッドパッチは情報設計を軸にしたUIデザインの考え方や方法論を学べるワークショッププログラムを提供いたしました。本事例では、ワークショップの設計から実際のワークショップ実...

ファインディ株式会社｜Work｜Goodpatch グッドパッチ

株式会社ジンズが開発したメガネ型デバイス「JINS MEME」。JINS MEME OFFICEはそのJINS MEMEの機能を活かした、人々のポテンシャルを最大限に引き出す、初めての「集中力計測アプリ」です。３つのセンサーでア...

JINS MEME OFFICE｜Work｜Goodpatch グッドパッチ

「ワンキャリアクラウド」は、戦略人事をターゲットとしたSaaSプロダクトです。学生支持率No.1の就職サイト「ONE CAREER」を運営するワンキャリアが、独自で保有する30万件の学生の声をもとにしたデータやコンテンツを活用し、これ...

ワンキャリアクラウド｜Work｜Goodpatch グッドパッチ

VEGERYは、九州産オーガニック野菜を中心とした生鮮食品のデリバリーサービスです。農薬不使用・化学肥料不使用の野菜・果物を中心に約190品をスマートフォンアプリ上で購入することが可能です。九州の農家を中心に直接赴き、仕入れを行ってい...

VEGERY｜Work｜Goodpatch グッドパッチ

Share work, connect with other designers, discover jobs and get hired.

Desktop Utility Icons by usagimaru | Layers

A concept of a node-based graph app for macOS.

Node-Based UI by usagimaru | Layers

Sketch for iPadOS Concept by usagimaru | Layers

Widgets for Bento.me by usagimaru | Layers

Panels by usagimaru | Layers

usagimaru | 🇯🇵 Software Designer / UI Architect / Developer

usagimaru | Layers

本気でクリエイターを目指すみなさんの学びを支援すべく、業界歴10年以上のトップクリエイターが集結。8/30(水)19時半〜オンラインにて、グッドパッチ・ソフトウェアデザイナー丸氏による「ソフトウェアを扱う人々のためのUIデザイン」をテーマにした特別講座を開催します。

リーダーズ講座「ソフトウェアを扱う人々のためのUIデザイン」8/30(水)19時半〜＠オンライン | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作

macOS native高品質なmacOSネイティブアプリケーション開発を志し、その技術と知見を共有するためのコミュニティです。

macOS native

59 Posts, 51 Following, 122 Followers · Interface design / Development on Apple platforms. 🇯🇵

usagimaru ⌘ (@usagimaru@mastodon.social)

なめらかなインターフェイスを実現するための考え方を紹介しています。各アカウントはbentoに記載しています。
https://bento.me/usagimaru

usagimaru｜note

usagimaruのTwitter / Xで不定期に投稿してきたUI設計のビジュアライズノート（デザインパターン解説）を収録しています。新しい投稿も随時追加していきます。

UI設計ビジュアライズノート集｜usagimaru｜note

Reflective UIと呼ばれる表現がにわかに注目されています。そのいくつかの事例紹介や、私自身が実際に実装してみてどうだったかの所感を書き留めておこうと思います。  Reflective UIとは  Reflective UIとは、光や映像の反射表現を活用してUIの質感を高めた表現を指します。ジャイロや加速度センサーを使って擬似的に反射を表現したり、カメラで取り込んだ映像をUIのテクスチャとして活用して、より現実感を持たせた表現などがあります。  カメラを使う場合、例えばフロントカメラでユーザーの顔や背後の映像を撮影しリアルタイムに加工して、テクスチャとしてUIの見た目に反映しま

Reflective UI実践：現実世界が映り込むUI表現｜usagimaru

解釈は人それぞれなのかもしれませんが、この業界には何でもかんでも“UX”を付けたがる癖があります。私はこの流行りには乗らずに物事を分けて考えてみたいです。   言葉の定義と解釈など  ユーザーインターフェイス（UI）の設計を表す言葉に関して、それをわざわざ「UX〜」と言い換える事例が国内外問わず多くあり、本来この“UX”と呼ばれるはずのものがどこか蔑ろにされているようにも感じられます。言い換えの例としては次のような具合です。   ・UIデザイン → UXデザイン ・UIデザインツール → UXデザインツール または UXツール ・UIデザイナー → UXデザイナー または UI/UXデ

何でもかんでも“UX”と言うのをやめる / Design for UX｜usagimaru

デスクトップ向けのアプリケーションやWebサイトなどでよく見られるパターン「マルチペイン型UI」の設計とその考え方を深掘りしてみます。今回は特にiOSにおけるiPad向けの新しいスプリットビュー／サイドバーのスタイルについて触れたいと思います。  ※iPadOSもiOSで括っています。  この記事の対象読者は次のような属性の方を想定しています： ・UIデザイナー ・iOSデベロッパー ・iPadのネイティブインターフェイスを設計しようとしている  マルチペインに関わる要素と言葉の定義  
マルチペイン–インターフェイス / Multi-Pane Interface 複数のペインから成る

マルチペイン型UIの設計観点／iOS 14の新しいスプリットビュー｜usagimaru

情報設計とは、端的に言うと「情報に関する混乱を整えて、理解しやすい形にする行い」です。情報設計というとなんとなくWebデザインやUIデザインに関する専門的な分野として認識されることが多いかもしれませんが、“情報” に関することなので、情報があるところには基本的にどこにでも通用します。  情報設計の専門書を漁ってみると、“ふわっとした” 話か、Webサイト設計の話に終始するものが多いのですが、本来はWebサイト設計以外の分野にも通用する考え方です。今回はiOSなどのアプリケーションデザインに焦点を当てて、UIの情報設計というものを考えてみたいと思います。  この資料では、「情報設計として

実例から考えるUIの情報設計｜usagimaru

ここ数年「デザインシステム」はIT業界を中心に流行語になっていますが、どうにも「〜システム」と呼んでしまっていることと、実際にそれが指している概念がはっきりしないが故に、私にとっては積極的に使いたくない語になってしまっています。皆さんが「デザインシステム」の語で言及しているものは、本当に同じ概念を指しているのでしょうか？   定義にあたってみる  「デザインシステム」「Design system」の言葉の定義を軽く調べてみました。  とりあえずWikipedia（英語）にはこのように書かれています。   デザインシステムは、任意のアプリケーションを組み立てるのに用いる再利用可能なコンポ

「デザインシステム」がよくわからないので、理解の仕方を変えてみる｜usagimaru

ユーザーインターフェイス（UI）のデザインに強く求められる技術や能力を列挙するとしたら、私は “情報を整理する能力” をまず挙げます。デザイナー職に対する世間一般の認識は「なんとなく絵を描くのが得意な人」だと思うのですが、絵が得意か不得意かはあまり本質的ではなく、情報をどのように整理して適切に表現できるのかが重要だと考えます。  UIデザインにおける “情報を整理すること” をもう少し詳しく説明すると、「設計コンセプトを形にし、コンセプトに基づく適切な部品の姿や機能を記述し、ユースケースに合った使い方を定義すること」と表せそうです。  コンセプトやユースケースもなく、いきなり「画面イメ

「モデルベースUIデザイン」構造化UIデザインの発想と方法論｜usagimaru

結論から言うとこれはLarry Teslerだそうなのですが、C=Copyはわかるにしろ、XとVがなぜCutとPasteに結びつくのか疑問に感じていました。Zもよくわかりません。これについて、都市伝説的に語られている言説にはこのようなものがあります。   CはCopyの頭文字。QWERTY配列ではCの隣にVがあるので、利便性からそれが選ばれた。XもCに隣接していることと、それがハサミの形状に似ているためCutコマンドに割り当てられた。Zは切り替えるスイッチを意味する。  出典：どこかで聞いた気がする都市伝説 これは間違いですが、それらしくも聞こえます。  カーネギーメロン大学のBrad

カット、コピー、ペースト、アンドゥをX,C,V,Zに割り当てたのは誰なのか｜usagimaru

はじめに  try! Swiftとは、AppleプラットフォームおよびSwiftデベロッパーのための国際コミュニティです。 世界中から参加者が集まり、最先端のSwift技術やAppleプラットフォームの情報、知識、テクニックを共有することを目的としています。カンファレンスは2024年3月22日より3日間にわたって東京・渋谷にて5年ぶりに開催されました。  


&nbsp;try! Swift Tokyo


try! Swift Tokyoが帰ってきました！ Swiftを使った開発のコツや最新の事例を求めて 世界中から開発者が集


tryswift.jp



 
 私は高度なSw

try! Swift 2024にて良いアプリデザインの感覚の持ち方について講演しました #tryswift｜usagimaru

この記事は、2023年7月8日に開催されたmacOSネイティブアプリケーション開発技術を主題としたイベント macOS native Symposium #09&nbsp;での同名講演が元になっています。講演時のスライドをベースにテキスト解説を書き下ろし、講演では触れなかった解説も追加しています。  Macらしいソフトウェアを形作るには、開発者によるUIパターンの理解が大切です。ひとえにUIパターンと言ってもさまざまなものがありますが、今回はUIパターンのうち“ウインドウ”に着目し、よく用いられるレイアウトや振る舞い方の解説を簡単に行いました。  今回のテーマはMacにおけるデスクトッ

デスクトップアプリケーションのUIパターン - ウインドウ編｜usagimaru

Progressive blur（プログレッシブ・ブラー）というのは、少し前からにわかに流行り出しているUIのスタイリングに関する表現の一つです。Variable blur（可変ブラー）、Gradient blur（グラデーション・ブラー）と呼ぶこともあります。その見た目は通常のブラー効果（ぼかし、ガウスブラー）とは少し異なります。このアーティクルでは、UIにおけるProgressive blur（またはVariable blur）の概要とAppleプラットフォームでの技術検証を紹介しつつ、後半では簡単な経緯やデザインとしての考慮事項を解説します。  例えば次のイメージはProgres

Progressive blur効果を用いたUI表現｜usagimaru

Apple Developer / Software Designer / UI Architect.
zenn.dev/usagimaru


@usagimaruのマイページ - Qiita

<strong>｢良いアプリケーションをデザインするための感覚の持ち方｣</strong>
ソフトウェアのデザインでは、プラットフォームのシステムとクリエイター独自のコンセプトとが矛盾なく成り立つことに強く意識を向けなければなりません。調和の取れた良いUIを目指すことは、ユーザーにとって親しみやすく、&hellip;

良いアプリケーションをデザインするための感覚の持ち方 / Cultivating a Sense for Designing Great Applications

GUIの“こちら側”からのデザイン（公開版）

GUIの表現方法ではなく、ユーザーの操作方法やイベントディスパッチの構造に着目してmacOSネイティブインターフェイスのデザインを考えます。CocoaにおけるResponder Chainの仕組みやUIの表現に触れつつ、macOS “らしい” GUIの&hellip;

GUIの“こちら側”からのデザイン / Designing GUI Face and Face

Goodpatch Engineer Meetup Vol.5 で登壇した際のスライドです。iOS Developerだった者がどのようにしてUIデザイナーとして取り組んでいったのか、Interface Architectの動き方や自己の紹介を兼ねながら、エンジニアリングの発想を活かすUI設計の観点を簡&hellip;

インターフェイスデザインとの向き合い方（公開版）/ How to face interface design

UI Crunch #12「伝える」を加速させる。書く、読むUI
https://ui-crunch.connpass.com/event/78845/

日本語アプリケーションのインターフェイスデザイン（公開版）

<a href="https://goodpatch.connpass.com/event/251756/">WWDC22 Recap in Goodpatch</a> 

WWDC22の発表内容とHIGの更新内容の振り返りつつ、AppleプラットフォームにおけるHIGの位置付けとソフトウェアUIデ&hellip;

The HIG & Software UI Design

<strong>デスクトップアプリケーションのUIパターン - ウインドウ編（公開版）</strong>

macOSらしいウインドウをデザインするために役立つ基本パターンを紹介します。

macOS native Symposium #09
https://macos-native.gith&hellip;

デスクトップアプリケーションのUIパターン - ウインドウ編（公開版） / UI Patterns of Desktop Applications - Window Layouts

Software designer / Architect / Apple Developer. なめらかなUIを備えた美しいソフトウェアを作るための活動をしています。道具を作ることや、作る環境を作ることに関心があります。Apple Developer Program加入者です。