マガジンのカバー画像

UIデザイン

30
運営しているクリエイター

2018年4月の記事一覧

UIデザイン研修 #001 MAU M&L 博物図譜

UIデザイン研修 #001 MAU M&L 博物図譜

担当:岩永

このアプリは、武蔵野美術大学が所蔵する解剖図・航海記・博物誌などの貴重な資料を、スマホの画面で見ることができる。

このアプリで目を引くのは、アプリを開いて最初に表示されるメニュー画面だ。様々な動物や昆虫、植物などがとても鮮やかに描かれている。まるで資料からそのまま飛び出してきているようだ。

さて、デザイン的観点で、私はこの画面にあるメニューボタンに着目した。
まず気になったのが、

もっとみる
言語切替のUIデザインについて考えてみる。

言語切替のUIデザインについて考えてみる。

いま、自分のポートフォリオを英語/日本語どちらにも対応しようと思っていて、どのように切り替えるべきか、リサーチのためにいろんなサイトを見て回った。その時にこれは良い、これは避けたほうが良さそう、と気付いたことがある。

国旗を使うことによる問題

デザイン上のスペースの節約からか、あるいはグラフィカルに補助したいという理由からか、言語切替のUIで国旗を見かけることがある。

日本にいると「日本=日

もっとみる
iPhoneメモアプリのUIトレースから…

iPhoneメモアプリのUIトレースから…

素っ気ないが至るところに配慮ありiPhoneのメモアプリをトレースしました。iPhoneのメモはアプリとしては素っ気なく見えますが至るところに配慮が尽くされています。そこで主にインタラクションの部分をなぞって、動作するメモアプリを作ってみました。

配慮1.新規作成時のキーボード表示

新規にメモを作成する時にキーボードが自動的に表示されます。
当たり前と思われるかもしれませんが、既存のメモを開い

もっとみる
PHOTOSHOP/もうボカさない!絶対に肌の質感を壊さないで綺麗に修正する人物レタッチテクニック。

PHOTOSHOP/もうボカさない!絶対に肌の質感を壊さないで綺麗に修正する人物レタッチテクニック。

こんにちは。

札幌を拠点とし活動中のレタッチャーNORD WORKSの大谷キミトです。

今回のレタッチテクニックはレタッチャーが広告制作で使う

ぼかさず絶対に肌の質感を壊さないで綺麗にレタッチすることができる人物修正テクニックです。

1000個以上売れているテクニックで一番人気です。

動画解説編もできました。

このテクニックは書籍「Photoshopレタッチ[伝わる]写真補正&加工を学

もっとみる
娯楽を超えたデザイン (UI Crunch #13 娯楽のUI イベントレポート)

娯楽を超えたデザイン (UI Crunch #13 娯楽のUI イベントレポート)

「UI Crunch #13 娯楽のUI - by Nintendo -」に参加しました。世界的にも注目される企業かつあまり表に出てこないデザイントークが聞けると言うことで、倍率も相当なものとなっておりました。この企画は構想から2年くらいかかったそうで、とても濃いお話を聞くことができました。めちゃ感動しました。今回は、そちらのイベントレポートです。最初の方あまり写真を撮らなかったので、後半の写真が

もっとみる
どうすれば選びやすいリストのUIが作れるのか

どうすれば選びやすいリストのUIが作れるのか

ここ最近リストで情報を掲載するUIを作成していて、より良いリストをつくるためにどんなことをチェックすれば良いのかを考えていました。

リストのUIを作成したり改善したりしている人は多くいるのではないかと思いますので、「あー最初からちゃんと考えておけばよかったな...」と思ったことを書いていきたいと思います。

(「情報を掲載するもの」として、カード形式のものもリストと呼んでおります)

ユーザーが

もっとみる
要素をずらして重ねるレイアウトについて

要素をずらして重ねるレイアウトについて

要素をずらすレイアウトの流行最近公開された、デザイン的に秀逸なウェブサイトを見ると、矩形 (長方形) やテキストといった要素を (あえて) ずらして重ねる手法を多く見つけることができます。
具体例をあげます。

napla recruit site

Abel

大阪医科大学

住信SBIネット銀行新卒採用サイト

まとめると、共通してこのような表現と言えるでしょう。

- 写真の両端もしくは片

もっとみる