フルサワナツキ

ITの会社のデザイナー2年目 修行中 http://nachous.com

フルサワナツキ

ITの会社のデザイナー2年目 修行中 http://nachous.com

  • 読書記

    読んだ本のまとめ

  • #週1UI トレース

    春休み中に週に1回UI トレースする自己満プロジェクト。ノートは不定期更新中。

  • UI分解

    既存のUIを1回分解して再構築します！

ベストバイ2022

ご無沙汰しています。かれこれnoteの記事を書くのは1年以上ぶりですかね。長い間が空いてしまいました。 2022年ももうすぐ終わるので今年買ってよかったものをまとめたいなと思っております。誰得？という感じもしますが誰かのお役に立てたら何よりですそれではさっそく見ていきましょう！ デスク周り編エルゴトロン　モニターアーム 今までモニタースタンドだったのですが、デスクを広々使いたいなと思って購入しました！組み立ても簡単な上に操作もしやすかったです！これを機にデスク周りを整えた

フルサワナツキ

    • つくりてビデオレターのおはなし

      こんにちは、フルサワナツキと申します。雪国の大学でデザインを学んでいましたが、この春から都内のIT企業の新卒デザイナーとして研修に励んでいます。 社会人になって早3ヶ月。本当は在学中に公開できたらと思っていましたが、引越しや新生活で精一杯で公開が遅くなってしまいました。 思い返すと、大学1〜3年のときはこまめに課題が出され、1課題につき長くても2か月くらいの時間で制作していました。とはいえ、基本的に1ヶ月のものが多かったので、その中でアイデアを考えるたり作品を作るのは結構ハー

      フルサワナツキ

      • 読書記 「ついやってしまう」体験のつくりかた

        こんにちは。 大学生になってからあまり本を読まなくなってしまったのですが、せっかくの春休みだし、気になっていた本を読んでたくさんインプットしよう！ということで本を何冊か読んだので記録のために読書記を書かせていただきます。 「ついやってしまう」体験の作りかた第1章 人はなぜ「ついやってしまうのか」 直感のデザイン 第2章　人はなぜ「つい夢中になってしまう」のか　驚きのデザイン 第3章　 人はなぜ「つい誰かに言いたくなってしまう」のか　 物語のデザイン 終章　 私たちを突き動

        フルサワナツキ

        • UI比較 天気予報アプリ編

          i Phoneのデフォルトの天気と、tenki.jp、weathernews、Yahoo!天気のUIを比較してみました。 ホーム iPhoneのデフォルトの天気は大まかに今日明日の天気と週間天気というシンプルな構成なので、細かい情報はいらないけどただただ天気が知りたいという人向けなのではないでしょうか。 Tenki.jpは今日明日の天気の下の比較的目に入りやすい位置に紫外線やPM2.5などといったお役立ち情報があり、しかも項目をカスタマイズできるのでパーソナライズ化しやす

          フルサワナツキ

        ベストバイ2022

        フルサワナツキ

        マガジン

        • 読書記
          1本
        • #週1UI トレース
          9本
        • UI分解
          3本

        記事

          UI比較 音楽アプリ編

          今回はSpotify AppleMusic LINE MUSIC AWAのUIを比較してみます。 検索画面 音楽再生画面 再生マークなど 音楽を探すページを　比較してみるとジャンル検索をするタイプ、ランキング検索をするタイプどちらの検索もできるタイプの3タイプがあることがわかりました。同じジャンル検索の画面のグラフィックを比べてみてもSpotifyはイラストベース、LINE MUSICとAWAは写真ベースなどここでも違いが見られました。 またSpotify、Apple

          フルサワナツキ

          UI比較 音楽アプリ編

          フルサワナツキ

          UI比較 乗換案内編

          今回はNAVITIME Yahoo!JAPAN乗換案内 JORUDAN乗換案内 JR東日本アプリのUIを比較してみます。 ホーム 経路案内 ホームも経路案内のページも、どのアプリも似ているUIだと思いました。 その中でもJR東日本アプリは情報量が少なくシンプルな印象です。 また、JORUDAN乗換案内は通常モードでも色合いがダーク系なので差別化できそうです（ちなみにYahoo!乗換案内はダークモード対応しているのでデバイスの本体によって色が変わります。） アイコンの比

          フルサワナツキ

          UI比較 乗換案内編

          フルサワナツキ

          UI分解mini 乗換MAPナビ編

          前の投稿のUI分解mini Pinterest編から、だいぶ時間があきましたが今回は乗換MAPナビ(iOS版)の乗換えページのリデザインを考えてみました。 乗換MAPナビについて乗換案内のアプリはYahoo!乗換やNAVITIMEなど、ざまざまなものが出ていますが今回改善する乗換MAPナビでは乗換案内の他に地図がみれるという点で差別化ができそうです。 乗換MAPナビの良いところと現状最初にも書いたように乗換案内と路線図ではなく地図がみれるというのは初めて行ったところとかで

          フルサワナツキ

          UI分解mini 乗換MAPナビ編

          フルサワナツキ

          UI分解 Pinterest編

          お久しぶりのUI分解、今回はPinterest(iOS版)のUIを考察して再構築できたら...！と思います。 それでは早速考察から！ そもそもPinterestとはPinterestのことを知らない方ようにざっくりまとめると、「アイデアのコレクションサービス」が一番イメージついやすいのではないかなと思います。 FaceBookやInstagramは過去形の出来事をTwitterは現在進行形の出来事を投稿しますがPinterestは未来の自分のためにストックを増やすという使い

          フルサワナツキ

          UI分解 Pinterest編

          フルサワナツキ

          週1UIトレース 総まとめ

          春休みが始まったころから始めた週1UIトレース、そろそろ春休みが終わるのに伴って一旦総まとめをしようと思います。 わたしの心の中で決めてたテーマトレースするサービスを選んだりトレースしたりする際にわたしの中でテーマを決めていました。 ①なにかをつなげるアプリをトレースする ②言語化する この２つです。 なにかをつなげるアプリとは ざっくり言えばユーザーと何かのワンクッションとなっているアプリでしょうか。過去のトレースしたものがどのようにつなげているのか個人的に解釈したもの

          フルサワナツキ

          週1UIトレース 総まとめ

          フルサワナツキ

          週1UIトレース 食べログ編

          食べログのアプリ(iOS版)の検索ページ・タイムライン・ユーザーページをトレースしました。まずは全体的にこんな感じ。 アプリを立ち上げてタイムラインではなくて検索ページが出てくるところがさすがレストランとユーザーを繋げるサービスだと感じました。それでは詳しく見てみましょう！ 詳しくみてみる検索ページ タイムライン ユーザーページ 使っている色 トレースして思ったこと ●やはり誘導の仕方が面白かった ●文字サイズの幅はそんなにないけどウェイトでメリハリをつけている

          フルサワナツキ

          週1UIトレース 食べログ編

          フルサワナツキ

          週1UIトレース メルカリ編

          メルカリのアプリ(iOS版)のホーム・ライブページ・出品者ページ・マイページをトレースしました！全体的にはこんな感じ。 デザイン的に繰り返しているところが多いなと感じました。では詳しくみていきましょう！ 詳しく見るホーム ライブページ 出品者ページ マイページ 使っている色 トレースをして思ったこと ●商品画像のサイズはほとんど120pxの正方形 ●ライブページのアイコンがすごくカラフル ●文字サイズの幅は狭め 商品の画像サイズの話 商品画像のサイズとしては8

          フルサワナツキ

          週1UIトレース メルカリ編

          フルサワナツキ

          週1UIトレース Spotify編

          Spotifyのアプリ(iOS版)のホーム・ブラウズ・アーティストプロフィール・マイページ・音楽再生ページをトレースしました。全体像はこんな感じ！ もともとがダークモードのアプリをトレースするのは初めてですごく新鮮な気持ちでトレースできました。それでは詳しく見てみましょう。 詳しくみるホーム ブラウズ アーティストプロフィール マイページ 音楽再生ページ 使っている色 トレースをして思ったこと ●文字のメリハリがある ●黒地に緑がインパクトが大きい ●Brow

          フルサワナツキ

          週1UIトレース Spotify編

          フルサワナツキ

          週1UIトレース Airbnb編

          Airbnbのアプリ(iOS版)のホーム、お気にり、物件ページをトレースしました！ こんな感じ！ パッと見てホワイトスペースが多いなと思いました！それでは詳しく見ていきましょう！ 詳しく見てみるホーム お気に入り 物件ページ 使っている色 実際にトレースをしてみて思ったこと ⚫︎文字のメリハリがある ⚫︎画像を大きく使っている ⚫︎色がシンプル ⚫︎やはりホワイトスペースが多かった 文字のメリハリ トレースしたところだけでも12〜30pxと文字サイズの幅がす

          フルサワナツキ

          週1UIトレース Airbnb編

          フルサワナツキ

          週1UIトレース Facebook編

          Facebookのアプリ(iOS版)のホーム・マイページ・投稿ページをトレースしました！全体的にはこんな感じ。 ザッと見るとInstagramと同じように文字よりも写真を強調させたいのかなと感じましたそれでは詳しくみていきましょう！ 詳しくみるホーム マイページ 投稿ページ 使っている色 トレースして思ったこと ●文字も写真もメリハリがある ●アイコンがすごく派手だった ●色がシンンプルでまとまって見える 文字も写真もメリハリがある 写真のメリハリがあるなという

          フルサワナツキ

          週1UIトレース Facebook編

          フルサワナツキ

          週1UIトレース Twitter編

          Twitterのアプリ(iOS版)のホーム・検索ページ・マイページをトレースしました。まずは全体的にこんな感じ。 こう見てみて始めに感じたことが文字の密度が高いなという点でした。それでは詳しく見てみましょう！ 詳しく見るホーム 検索ページ マイページ 使っている色 実際にトレースをしてみて思ったこと ●文字サイズの幅がある ●検索ページで何が起きてるのか知れる ●使っている色が少ない ●アイコンが鳥に関係している 文字サイズに幅がある 文字サイズは11〜20p

          フルサワナツキ

          週1UIトレース Twitter編

          フルサワナツキ

          UI分解 Sound Cloud編

          こんにちは。 春休み期間に週1UIトレースという自己満プロジェクトを黙々としていた訳ですがそろそろ実践的なことがしたいなと思って既存アプリのUIを勝手にリデザインするUI分解をはじめました。名前の由来は1回分解して再構築してみようということから。そんなことはさておき、記念すべき１発目はSound Cloud（iOS版）を分解しました！ Sound Cloudって？一言でまとめると「音楽発見サービス」でしょうか。 類似のサービスとしてはSpotify、AppleMusic、L

          フルサワナツキ

          UI分解 Sound Cloud編

          フルサワナツキ