ますあや/UIデザイナー

未経験からUIデザイナーになりました。 勉強が好きです。2019年の目標はデザイント…

ますあや/UIデザイナー

未経験からUIデザイナーになりました。 勉強が好きです。2019年の目標はデザイントレース200。 トレース記録、日々の業務の中から気づいたことを書いていきます。

マガジン

記事一覧

最近のトレース振り返りとこれから

しばらくnoteお休みしていましたが、今年も残り3ヶ月を切ったので、トレースについて振り返りをしようと思います。 進捗としては118。仕事が忙しかったこともあり、目標の…

今更じゃない、Bootstrap!デザイナーの視点で、美味しい活用方法を紹介します

こんにちは。最近トレース記事をupできていませんが、近いうちまとめ的なものを出したいと思っています。 今回は、以前会社のオウンドメディアで書いたBootstrapの記事に…

バングラデシュの開発チームと働いてみて

こんにちは。なすのこ改め、ますあやです。普段使われている愛称に名前を変更しました😋 最近デザイナー向けの英語記事をよく見かけますが、私もコツコツ勉強してきた甲斐…

デザインの引き出しを増やすために私が半年間でやったこと

前回投稿してから4ヶ月。 期間は開いてしまいましたが、ほぼ日トレース200とは別に、上司と上期チャレンジすることを決め、それを頑張っていました。 というわけで、今回…

ほぼ日トレース #024-027 Behanceから面白い感じのデザインを引っ張ってきてトレースして見た

こんにちは、なすのこです。 今回はBehanceから面白いと思ったレイアウトのデザインを4回に分けてトレースしてみました。 オリジナルは、こちら。 トレースはこうなりま…

ほぼ日トレース #020-021 動画配信アプリの起動時画面をのトレースして比較してみた

こんにちは、なすのこです。 今回は動画配信アプリの起動時画面をトレースしてみました。 1/28…NETFLIX #20 1/29…Abema #21 1/30…Prime Video #22 2/2…YouTube #23

ほぼ日トレース #019:旧オリンピックシンボルマーク案をトレースして感じたこと

今回はちょっと番外編です。 仕事の大半がwebやアプリのデザインですが、時々ロゴやイラストを作る機会があるので、3-4回みっちりUIトレースをして分析した後、こういう回…

ほぼ日トレース #016-018 マッキンゼーのコーポレートサイトをトレースしてみた

こんにちは。なすのこです。 今週は、マッキンゼー・アンド・カンパニー(以下:マッキンゼー)のグローバルサイトをトレースしました。 マッキンゼーと言えば、世界屈指…

ほぼ日トレース #012-015:SNSを比較してみた

前置きこんにちは。なすのこです。 ちょっと日にちが空きましたが、トレースは進めておりました。 今回はSNS編、ということでSNSの立ち上げ時ファーストビューをトレース…

ほぼ日トレース #012:SNS編 -Facebook-

こんにちは。なすのこです。 トレース10個目にしてちょっと効果が出てきたかも、と思うことがありました。その辺も追追まとめていけたらと思います。 新しい試み前回書い…

ほぼ日トレース -011:馴染みよいイラスト-と、決意表明

今回のトレース今回はイラストをトレースしてみました。 私は、イラストのブランディングがよくできているWebサイト・サービスのデザインが好きです。デザイナーって、意…

ほぼ日トレース -010:TikTok-

こんにちは、なすのこです。やっぱり仕事が始まると、毎日更新というのは難しいですね。 最近はそこそこ忙しい感じです。でもゴリゴリデザインできて楽しい。 去年の今頃…

ほぼ日トレース -009:metalab Careers-

こんばんは。なすのこです。深夜2時になってしまいました😇。 仕事は20時半には上がったのですが、そのあとご飯食べたりウトウトしてしまってこんな時間に! さてさて、今…

ほぼ日トレース -008:メルカリ ロゴ-

年明けてから営業2日目。 ありがたいことに(?)今日も忙しい限りです。 時々Twitterなどで、巡り巡って「未経験の私がデザイナーになれましたー!」という報告を見るこ…

ほぼ日トレース -007:Airbnb-

日が過ぎてしまいましたが、今日もほぼ日トレースです。 新年早々仕事が長引いてしまい、こんな時間になってしまいました😇 今回は気分を変えてアプリのデザイン。おなじ…

ほぼ日トレース -006:Loftwork Webサイト②-

前回に引き続き、Loftworkさんのサイトをトレースします。 💿 オリジナル↓ 📀トレース↓ 気づいたこと🤔各見出しの組み合わせが、センター揃えと左寄せで、libre b…

最近のトレース振り返りとこれから

最近のトレース振り返りとこれから

しばらくnoteお休みしていましたが、今年も残り3ヶ月を切ったので、トレースについて振り返りをしようと思います。

進捗としては118。仕事が忙しかったこともあり、目標の200の達成はいよいよ怪しくなってきましたが、できるところまでやろうかなと思っています✊。前回挙げたのが#67までだったので、更新数は約50。流石に全部は多いので、いくつかピックアップします。

ほぼ日トレースのルール2019年1

もっとみる
今更じゃない、Bootstrap!デザイナーの視点で、美味しい活用方法を紹介します

今更じゃない、Bootstrap!デザイナーの視点で、美味しい活用方法を紹介します

こんにちは。最近トレース記事をupできていませんが、近いうちまとめ的なものを出したいと思っています。

今回は、以前会社のオウンドメディアで書いたBootstrapの記事に、編集を加えて載せてみました。Bootstrapって聞いたことあるけどよくわからない、Bootstrapってなんだ、どこにレスポンシブを打ったらいいのかわからない!という方に読んでいただきたいです。

Bootstrapってなに

もっとみる
バングラデシュの開発チームと働いてみて

バングラデシュの開発チームと働いてみて

こんにちは。なすのこ改め、ますあやです。普段使われている愛称に名前を変更しました😋

最近デザイナー向けの英語記事をよく見かけますが、私もコツコツ勉強してきた甲斐あって、デザイナーになって1年程してから、バングラデシュのオフショアチームと働くプロジェクトに関わりました。

今回はトレース200から離れて、そのプロジェクトを通して得られた気づきなどを、少しご紹介しようと思います。

🇧🇩アクセ

もっとみる
デザインの引き出しを増やすために私が半年間でやったこと

デザインの引き出しを増やすために私が半年間でやったこと

前回投稿してから4ヶ月。

期間は開いてしまいましたが、ほぼ日トレース200とは別に、上司と上期チャレンジすることを決め、それを頑張っていました。

というわけで、今回はようやくデザイナー1年生をクリア(?)した、私の半年間のチャレンジ活動報告をします!🎉🎉🎉🎉

①AXAのトレース&ルール化1月くらいから、デザインルール周りを任せてもらうことが出てきたので、AXAのトレース&ルール化にチ

もっとみる
ほぼ日トレース #024-027 Behanceから面白い感じのデザインを引っ張ってきてトレースして見た

ほぼ日トレース #024-027 Behanceから面白い感じのデザインを引っ張ってきてトレースして見た

こんにちは、なすのこです。

今回はBehanceから面白いと思ったレイアウトのデザインを4回に分けてトレースしてみました。

オリジナルは、こちら。

トレースはこうなりました👇

2/4 メインビジュアル #24
2/5 We are Airbusのところ #25
2/7 New Eventsのところ #26
2/9 Get on board以下 #27

真似したいポイント
👍全てが王

もっとみる
ほぼ日トレース #020-021 動画配信アプリの起動時画面をのトレースして比較してみた

ほぼ日トレース #020-021 動画配信アプリの起動時画面をのトレースして比較してみた

こんにちは、なすのこです。
今回は動画配信アプリの起動時画面をトレースしてみました。

1/28…NETFLIX #20
1/29…Abema #21
1/30…Prime Video #22
2/2…YouTube #23

📀トレース

以下、各アプリの特徴を見ていきたいと思います。

📍Netflix #20
1年前はprimeとほぼ同じ画面だったのに、ずいぶん変わっていて驚きました。

もっとみる
ほぼ日トレース #019:旧オリンピックシンボルマーク案をトレースして感じたこと

ほぼ日トレース #019:旧オリンピックシンボルマーク案をトレースして感じたこと

今回はちょっと番外編です。

仕事の大半がwebやアプリのデザインですが、時々ロゴやイラストを作る機会があるので、3-4回みっちりUIトレースをして分析した後、こういう回をはさんでいきたいと思います。

今回は、例の不採用になった佐野研二郎さんのオリンピック・パラリンピックのシンボルマークをトレースして、デザインの特徴や盗作疑惑問題への対応方法など考察してみたいと思います。以下、トレースしたもので

もっとみる
ほぼ日トレース #016-018 マッキンゼーのコーポレートサイトをトレースしてみた

ほぼ日トレース #016-018 マッキンゼーのコーポレートサイトをトレースしてみた

こんにちは。なすのこです。

今週は、マッキンゼー・アンド・カンパニー(以下:マッキンゼー)のグローバルサイトをトレースしました。

マッキンゼーと言えば、世界屈指の戦略コンサルティング企業ですが、昨今コンサル業界全体でデザインを重要視しており、マッキンゼーも2015年にデザイン会社LUNARを買収したことが話題になりました。

数年前に、マッキンゼーのWebサイト(これは日本向けだったかも)を見

もっとみる
ほぼ日トレース  #012-015:SNSを比較してみた

ほぼ日トレース #012-015:SNSを比較してみた

前置きこんにちは。なすのこです。
ちょっと日にちが空きましたが、トレースは進めておりました。

今回はSNS編、ということでSNSの立ち上げ時ファーストビューをトレースしました。

やったのは、以下の通り。
👪Facebook(#12)
💬Twitter(#13)
📷Instagram(#14)
🎵Tiktok(#15。#10からiphoneXSverに更新)

📀トレースしたもの

もっとみる
ほぼ日トレース  #012:SNS編 -Facebook-

ほぼ日トレース #012:SNS編 -Facebook-

こんにちは。なすのこです。
トレース10個目にしてちょっと効果が出てきたかも、と思うことがありました。その辺も追追まとめていけたらと思います。

新しい試み前回書いた通り、ただ200個トレースするのもな〜〜と思い始めていたので、同業他社のサイトや、類似サービスで括りながら、トレースしてみることにしました。そちらの方が見えるものが多そうです。
だいたい1トレース3パターンくらいトレースしてみようかと

もっとみる
ほぼ日トレース -011:馴染みよいイラスト-と、決意表明

ほぼ日トレース -011:馴染みよいイラスト-と、決意表明

今回のトレース今回はイラストをトレースしてみました。

私は、イラストのブランディングがよくできているWebサイト・サービスのデザインが好きです。デザイナーって、意外と絵に苦手意識を持つ人が多いですが、私は絵を描くのも好きで、上手い下手は置いておいて、アイコンも自作です。

こういう画風は結構好きですが、記号的なイラストの方が、よりWebやアプリのデザインによく馴染みます。

例えばGoogleカ

もっとみる
ほぼ日トレース -010:TikTok-

ほぼ日トレース -010:TikTok-

こんにちは、なすのこです。やっぱり仕事が始まると、毎日更新というのは難しいですね。

最近はそこそこ忙しい感じです。でもゴリゴリデザインできて楽しい。
去年の今頃は、まだ「デザイナーになりたい!」と思ってた頃で、翌年こんなにデザインしてるなんて想像してなかったな。
数年は(アラサーだけど)雑用かな…と思ってたけど、色々任せてくれて、本当に有り難いです。

さて、今回はTikTokをトレースしました

もっとみる
ほぼ日トレース -009:metalab Careers-

ほぼ日トレース -009:metalab Careers-

こんばんは。なすのこです。深夜2時になってしまいました😇。
仕事は20時半には上がったのですが、そのあとご飯食べたりウトウトしてしまってこんな時間に!

さてさて、今日のトレースは〜・・・
カナダのデザイン会社metalabさんの自社サイト。

思いっきりシンプルなのに、ディティールへのこだわりがえげつないmetalabさんのサイト。今回はTOPページではなく、Careerのファーストビューをト

もっとみる
ほぼ日トレース -008:メルカリ ロゴ-

ほぼ日トレース -008:メルカリ ロゴ-

年明けてから営業2日目。
ありがたいことに(?)今日も忙しい限りです。

時々Twitterなどで、巡り巡って「未経験の私がデザイナーになれましたー!」という報告を見ることがあります。私もそのクチです。
違うかな、と思う点があるとすれば、勉強期間と年齢。Twitterの報告内容を見ると、だいたいデザインの勉強期間が半年だったり、20代前半、なんなら学生さんが多い気がします。私はデザイン勉強は3年く

もっとみる
ほぼ日トレース -007:Airbnb-

ほぼ日トレース -007:Airbnb-

日が過ぎてしまいましたが、今日もほぼ日トレースです。
新年早々仕事が長引いてしまい、こんな時間になってしまいました😇

今回は気分を変えてアプリのデザイン。おなじみ、Airbnbです。

💿オリジナル↓

📀トレース↓

*下のナビのみ、スクショです。

気づいたこと

🕵️‍♂️左右の余白が、左:24px/右:23px、真ん中の隙間が12pxでした。1パーツのサイズがwidth:158p

もっとみる
ほぼ日トレース -006:Loftwork Webサイト②-

ほぼ日トレース -006:Loftwork Webサイト②-

前回に引き続き、Loftworkさんのサイトをトレースします。

💿 オリジナル↓

📀トレース↓

気づいたこと🤔各見出しの組み合わせが、センター揃えと左寄せで、libre baskerville italic 12px C0A700* proxima nova 28px 333333が逆になっている。バランス的にはどちらかに揃えてもあり得そうですね。

🤔各日本語タイトルやpタグに、

もっとみる