Daily UI

本

Daily UI挑戦記。デイリーにならないけどちまちまチャレンジしていきます。

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

Daily UI #013 Direct Messaging

11時半までに家を出なければかつ#012がちょっと重そうなので後回しにします。。 #013 Direct Messaging DM画面です。けっこうDMの画面って要素は似ている他サービスを見てみると、下記要素から「誰が・いつ・何を」送ったかがわかるUIになっていることが多かった。相手のアイコン相手のアカウント名メッセージメッセージの送信日時メッセージ以外のリアクション字きったねえ… 上記を踏まえた上でUIの作成を行います。と思いつつこっちも他サービス

Daily UI #011 Flash Message(Error/Success)

SUCCESS！って良い言葉ですよね。（脈絡のないあいさつ）今日もDailyUI挑戦していきます。 #011 Flash Message(Error/Success) 何かの処理が完了またはエラーが発生した際に表示されるメッセージ…ポップアップと言うのが馴染みがある気がします。実はあまり記憶にないFlashメッセージ見出しのとおり、お恥ずかしながらFlashメッセージの事例があまり浮かんでこず…イメージ的にはiPhoneの\ﾎﾟｷｰﾝ/でしょうか（伝われ） Flas

Daily UI #010 Social Share

「月曜〜金曜のお昼頃更新」を見事に破りました。そして来週から無事（？）社会復帰を果たすのでマガジンの説明文変えなきゃな…笑遅ればせながら、本日のDailyUIもやっていきます。よろしくお願いします。 #010 Social Share ソーシャルメディアでシェアする用のパーツです。ページ全体とかじゃなくてパーツとしてのデザインをするのは#005のアプリアイコン以来とかかしら…。他サービスを見てみた実は今回のお題、個人的には前々から気になっていたことがありまして。

Daily UI #009 Music Player

ノートPCがひんやりして手がかじかむ季節になってきましたね。。。今日もDailyUI挑戦していきます。 #009 Music Player 音楽プレーヤーです。と言いつつも普通に音楽を聴くだけならiPhoneの標準プレーヤーで全然事足りちゃうなあと思ってしまったので、今回はいわゆる「耳コピ用プレーヤー」を想定して作成してみようと思います。耳コピとは？楽器の演奏において楽譜を読まず曲を聴いて演奏を真似することです（という認識）。その名の通り耳でコピー。「楽譜が用

Daily UI #008 404 page

猫派？犬派？と聞かれて「どっちも」と答える、強欲女子ことしゃーしゃです。今日もDailyUI挑戦していきます！ #008 404 page 404エラー（ページが見つからない）が発生した際に表示されるページのことです。 404ページもUXデザインの一部…？いつものようにさまざまなサイトの404ページを探してみました。 404ページへのリダイレクトをせずにエラーメッセージが記載されるページもあったが、面白コンテンツがあったり別の方法で情報にたどり着ける導線を引いてあげた

Daily UI #007 Settings

11月から有給消化に入っていましたが、なが〜〜い夏休みも残すところあと10日ちょいとなりました。のんびり過ごしすぎて無事に社会復帰できるか不安になってきているところです。。気を取り直して本日のお題です。 #007 Settings いわゆる設定画面です。今回は引っ張りハンティングでおなじみの「モンスターストライク」の設定画面の内容を一部拝借してデザインに挑戦します。実際の画面はこんな感じ。ごつごつしていて機械を操作している感がゲームの世界観をアレしててかっこい

Daily UI #001 Sign Up

ものはためしということで。早速 #Daily_UI 1つめのお題をやってみました。 #001 Sign Up いわゆる「新規登録画面」にあたるようです。サービスの設定とある映画のティザーサイトをイメージしました。公開情報がまだサイトにないため、最新情報をメールマガジンで提供するサービスです。目的メイン：メールアドレスを登録してもらうサブ：ティザーサイトを他SNSでシェアしてもらう UIの内容今回はスマートフォン向けUIを作成。主に下記の点に注意しました。

Daily UI #002 Credit Card Checkout

2回目にして早速デイリーでなくなったDailyUI。。涙とはいえ続けることがきっと大事なのだと信じて今日もがんばります。 #002 Credit Card Checkout クレジットカードの決済画面です。サービスの設定今回は実在するサービスの「小田急ロマンスカー」の座席予約時の支払い入力画面を題材にしてみました。飲み会や仕事がしんどかったときの帰りに月2、3回くらいのペースでお世話になっています。ありがとう小田急。。（そして個人的に車内販売のカットラスクが超絶お

Daily UI #003 Landing Page (above the fold)

3回目のDailyUIです。難しかった… #003 Landing Page (above the fold) いわゆるランディングページのファーストビューと呼ばれる部分です。サービスの設定香水の好みなどに答えていくつか候補をピックアップしてくれる架空のサービスを想定しました。香りは実際にためしてみないとわからない、つまりweb上だけで完結する行動ではないので、うまく実店舗とつなぎこみをする仕組みを考えたかったのですが今回は取り急ぎお題の遂行を…。目的商品購入の前

Daily UI #004 Calculator

普段何気なく使っているものって「何気なく」使えるくらい自然な動きができる設計なんだなってことに気付かされた4回目のDailyUIです。 #004 Calculator 電卓とか計算機とか。サービスの設定スマートフォンで使うけど、最低限の機能はつけておきたいよねということで、メモリー計算機能と計算式を入れてみることに挑戦してみました。ベースはiPhoneに標準搭載されている計算機アプリです。目的実機との違和感なく電卓を操作できる UIの内容PCで電卓操作をするシー

Daily UI #005 App Icon

DailyUIを始めてから、前回初の「スキ」をいただきました！ありがとうございます( ੭ꠥ⁾⁾˃̶͈̀ロ˂̶͈́)੭ꠥ⁾⁾うれしい！今回もがんばりまーす！ #005 App Icon アプリアイコン。そのまんま。サービスの設定今回は「万歩計」のアプリを作ります。最近見ているYoutube動画で万歩計が大活躍しているのでふと思い立った次第。そういえばアプリアイコンって２種類に区分できない？自分のホーム画面を見てみるとアプリアイコンの種類には大きく2種類があった。

Daily UI #006 User Profile

無職でずっとお休みのはずなのに、土日はがっつりお休みとして遊んでいました。えへえへ今週もDailyUI挑戦していきます！ #006 User Profile プロフィール画面ですね。今回は「興味のある領域の似ている人同士でつながりやすい学習系コンテンツ投稿サービス」を想定してプロフィール画面を作ってみようと思います。プロフィールにはどんな情報が必要？各サービスのプロフィール画面を見てみると、共通しているのはユーザー名・アイコンなどの「ユーザーを識別する情報」。サ