タグ

UIとiPhoneに関するd4-1977のブックマーク (34)

  • マシなiOSアプリのフォームを実装・デザインする - AnyType

    普段iOSのフロント寄りの実装やデザインについて手が着けられていなかったけど、Xcode6の新機能のおかげでそっちも興味がでてきたので、ログインフォームを想定してiOSアプリのフォームの設計について気出して考えてみた。 最もシンプルなフォーム メールアドレス用のUITextField(以下emailField)、パスワード用のUITextField(以下passwordField)、そしてログインボタン用のUIButton(以下loginButton)の3つをStoryboardで配置した。 emailFieldはKeyboard TypeをE-mail Addressに、Return KeyをNextに設定した。passwordFieldはSecure Text EntryのチェックをオンにしReturn KeyをGoに設定した。 問題点 emailFieldでReturn Keyを押

    マシなiOSアプリのフォームを実装・デザインする - AnyType
  • SlackTextViewControllerを読んだ - AnyType

    UI周りの理解を深めるため、Slackが公開しているhttps://github.com/slackhq/SlackTextViewControllerを読む。コミット番号は9fcf06ac6f7004e4aacb6536b375d1cb03f08289だ。 全部はさすがに読みきれないので、以下の気になるポイントに集中してコードを読んでいくことにする。 キーボードの表示/非表示に伴うレイアウトの調整。何も工夫しないとキーボードでViewが隠れてしまうはずだ。 ユーザー名や絵文字の補完 TL;DR キーボードの表示/非表示の際に送信される通知UIKeyboardWillShowNotification等を使ってレイアウトを調整している。レイアウトはすべてAuto Layout上の制約をプログラムで制御することで調整している。例えば、キーボードの高さに併せてスクロールビューの高さを大きくしたり

    SlackTextViewControllerを読んだ - AnyType
  • 片手操作特化のToDoアプリ JetDo

    最近はZenyやListTimerなど、シンプルで使いやすいUIを突き詰めたアプリを作ってたけど、ついにToDoアプリまで作ってしまいました。 JetDoの無料ダウンロードはこちら 正直、ToDoアプリなんてありふれたものは絶対作るまいと思ってたんです。Storeにはありとあらゆる代用品があるし。そういうものはいいだろと。 じゃあ、なんで作ったか? これは僕が人気ToDoアプリをたくさん試してどれも続かなかったからで、そもそも、それはなぜだろうかと疑問に思ったのが原点でした。 何度も何度も考えると、重要な要素が3つありました。 画面上部は片手で押しにくい ジェスチャーはタップと比べ疲れる タスク削除のサクサク感が重要 この3つの要素を解決して、余計な機能を削ぎ落とし、文字やボタンをでかくして生まれたのがJetDoです。ちょっと説明してみます。 画面上部は片手で押しにくい 僕はiPhone

    片手操作特化のToDoアプリ JetDo
    d4-1977
    d4-1977 2014/08/13
    一点突破がいいな
  • iPhone Dev Sap勉強会で発表した「iPhoneアプリのUIデザイン - NoteCubeの場合」の資料を公開しました。 - らっこのじゆうちょう

    5月10日の「iPhone Dev Sap勉強会 May, 2014」で発表した「iPhoneアプリUIデザイン - NoteCubeの場合」のスライドを公開しました。 iPhoneアプリUIデザイン - NoteCubeの場合 from Daigo Wakabayashi NoteCubeというメモアプリを制作する際に、UIについてどのように考えてデザインしたかについてお話しました。 https://itunes.apple.com/jp/app/notecube-shinpurude-shiiyasuimemoapuri/id657311491?mt=8&uo=4&at=11ldBU アプリのUIについては、いろいろと思うところや伝えたいこともあるので、次回7月のDevSap勉強会でも何かお話したいなーと思っています。

    iPhone Dev Sap勉強会で発表した「iPhoneアプリのUIデザイン - NoteCubeの場合」の資料を公開しました。 - らっこのじゆうちょう
  • アプリUIデザイナー名インタビュー7選 - showrtpath - iOSブラウザ開発日記

    2013-12-27 アプリUIデザイナー名インタビュー7選 iOS開発 こんにちはnasustです。iOSのヒットアプリのUIのデザインはどれも優れています。 今回はUIのデザインに関わるデザイナーの読み応えのある名インタビューを紹介します。 Pathで働く女性デザイナーの一日 in San Francisco | freshtrax | btrax スタッフブログ 革新的デザインの裏側【インタビュー】Flipboardデザイン主任-Marcos Weskamp | freshtrax | btrax スタッフブログ 【インタビュー記事】日人初のDribbblerに聞く、優れたUIデザイナーになる為の秘訣とは: 前編 | MEMOPATCH 【インタビュー記事】日人初のDribbblerに聞く、優れたUIデザイナーになる為の秘訣とは: 後編 | MEMOPATCH Pinterest

    アプリUIデザイナー名インタビュー7選 - showrtpath - iOSブラウザ開発日記
  • パターンで考えるスマートフォンのUIデザイン - UX Kyoto #08 メモ - 日々の御伽噺

    パターンで考えるスマートフォンのUIデザイン - UX Kyoto #08に参加してきたので、メモ書きの公開。自分がわかるように書いているので、見にくいかもしれません。全般的に非常に面白い話が聞けました。情報をどう見せるか、ユーザの操作をどう導くか、そしてそれを実装していくときどう気をつければいいか、その点がまとまって発表されたのがよいですね。 スマートフォンのUIデザイン スマートフォンのためのUIデザイン ユーザー体験に大切なルールとパターン 作者: 池田拓司出版社/メーカー: ソフトバンククリエイティブ発売日: 2013/03/30メディア: 大型 クリック: 117回この商品を含むブログ (4件) を見る UIのパターン化・ルール化 画面全体をコンポーネント単位に分割 昨日やユーザ体験居合わせてコンポーネントのパターンを選ぶ タブのデザインでもいくつかある 適切なデザインが必要

    パターンで考えるスマートフォンのUIデザイン - UX Kyoto #08 メモ - 日々の御伽噺
    d4-1977
    d4-1977 2013/07/30
    なんだか、よさそうなまとめ
  • How to Make a Vesper: Design « Vesper

    Vesper is opinionated software. Every interaction, pixel, and line of code was carefully considered, and no work was too precious to throw away. I’d like to share some history of how Vesper came to look and feel the way it does. The Idea Last summer, Justin Williams approached me about doing a project based on an idea John Gruber came up with. The idea was simple: you’d have a list of things, and

  • 【アプリ開発のお手本に】iOS 7の設計においてアップルが大切にした4つのポイント | TOKOROM BLOG

    今回の記事はUIデザイナの Morino氏 からの寄稿です 前回 はiOS 7紹介ビデオの中のジョナサン・アイブ氏のパートをご紹介しました。 今回は、その中でも特に重要と感じたいくつかのフレーズをピックアップして深堀りしてみたいと思います。 “True simplicity” iOS 7から話題の"フラットデザイン"が採用されて、画面デザインは大分シンプルな外観になりました。 使う色の数は限定され、簡単明瞭なラインやシルエットがほとんどのデザインを占めています。 iOS 6まで採用されていたSkeuomorphism(装飾的・リアルな外観)は排除され、立体的で質感を感じるデザインから、平面的で形やテキストの意味性をストレートに伝えるデザインに変わりました。 ただ、“Simplicity"という言葉は、単に外観を表すものとして使われているわけではありません。 「複雑さに秩序をもたらす」という

  • TechCrunch | Startup and Technology News

    Less than one year after its iOS launch, French startup ten ten has gone viral with a walkie talkie app that allows teens to send voice messages to their close… While all of Wesley Chan’s success has been well-documented over the years, his personal journey…not so much. Chan spoke to TechCrunch about the ways his life impacts how he invests in startups.

    TechCrunch | Startup and Technology News
  • Starter's Guide to iOS Design

    21 May 2013 32 minutes As someone who does work on both the development and design side of iOS apps I find that many designers struggle with the transition to UI work, or with the different processes involved in iPhone and iPad app design. In this guide I'll describe the deliverables you'll be expected to produce, outline the constraints of the medium and introduce fundamental iOS and UI design co

  • iPhoneはなぜ気持ちがよいのか? (1/5) | Telescope Magazine

    近年「気持ちよいインタフェースをつくりたい」という要求や、「気持ちよいインターフェースとは何か?」その理由説明が求められてきている。ネット上では、ある製品が出ると、製品のインターフェースやさわり心地を、サクサク感とか、もっさり感、ヌルヌル感と表現する人たちがいる。これは、「気持ちよさ」への注目が高まっていることの表れであるが、実際それが何であるのか、その原理は解明されていない。 今回の記事では、そういった「気持ちよさ」がどこからやってくるのか、道具の透明性・身体性をキーワードに、ものづくりやデザインに必要なこれからの発想を探っていこう。 道具の透明性からはじまるヒューマンインタフェース研究 道具は「透明性」が重要であると言われている。人がある道具を利用しているときに、その道具自体をなるべく意識させず目的に集中できるようにするためだ。例えば、スコップやハンマー、身近なところでは、ハサミやペン

    iPhoneはなぜ気持ちがよいのか? (1/5) | Telescope Magazine
  • サイト制作時のメモ 2012年前半

    ここ最近でサイトを作ったときに思ったことのメモです。 個人的なサイトを昨年末と今年の7月に1つずつ、それ以外でやったのが春に1つ(結局なかったことにされたけど)、今やってるのが1つ。 昨年末のは一応レスポンシブウェブデザイン、7月のと春のは普通のソリッドレイアウト、今やってるのがスマートフォンサイト。 昨年末に作ったものについてははてなダイアリーの方でも書いたし、内容は被るけど改めて。 全般「HTML5 Boilerplate」は丸ごとというより必要な部分だけ抜き出して使うと便利。 「これは要らないかなー」という部分を探すのにはコード読まないといけないので、それだけでも結構勉強になると思う。 単純なサイトなら頑張って画像作らなくてもなんとかなったりする。 (対象がいわゆるモダンブラウザの場合) Sass 3.2から使えるPlaceholder Selectorは凝ったことしなくても普通に便

    サイト制作時のメモ 2012年前半
    d4-1977
    d4-1977 2012/08/17
    スマートフォンの話も
  • 【ゲスト寄稿】ずっと使われるサービスを作るうえで、大切にしている3つのこと | Startup Dating [スタートアップ・デイティング]

    この記事をゲスト寄稿してくれたのは閑歳孝子さん。現在ユーザーローカルにてWebサービスの開発に携わる。日経BP社で専門誌の記者・編集を3年経験した後、知人が立ち上げた Web系ベンチャーに転職。ブログやSNSの自社パッケージ開発を手がけた後、2008年より現職でWebアクセス解析ツールの開発・企画・UI ・デザインなどを担当。 こんにちは、はじめて、閑歳孝子(かんさいたかこ)と申します。株式会社ユーザーローカルにてアクセス解析ツールを開発する傍ら、個人制作としていくつかサービスを運営しています。最近リリースしたものとしては、クラウド家計簿サービス「Zaim」があります。 2011年7月にiPhone版、2011年11月にiPad版、そして2012年3月にAndroid版を発表。幸運なことに多くのユーザーに継続してご利用いただいており、合計して約11万ダウンロード、入力されたお金の情報は30

  • スマホアプリ開発現場におけるUI採用の試行錯誤 - ロケタッチの場合 - : LINE Corporation ディレクターブログ

    こんにちは、ユティです。ロケタッチを担当しています。 スマートフォンで展開するサービスの開発では、1つ大事なことがあります。それは、4インチ前後の画面にすべてを詰め込まなくてはいけないということです。これ以上、画面のサイズが大きくなると片手で持てなくなるので、この4インチ前後というサイズのトレンドはしばらく続くでしょう。アプリが複雑になればなるほど、この狭い画面に展開する UI で悩むことになり、その度に私たちはいろいろな方法でその壁を乗り越えていくことになります。 ロケタッチも、リリース以降機能がどんどんと増え、その度にアプリ内の UI、特にメニューのところをどうしようかという話になりました。今回は、そのメニュー周りのUIを中心に、近頃のロケタッチのUI事情についてご紹介したいと思います。 代表的なメニューUIと、トレンドのスライドメニュー まず、過去のロケタッチを例に、多くのスマートフ

    スマホアプリ開発現場におけるUI採用の試行錯誤 - ロケタッチの場合 - : LINE Corporation ディレクターブログ
  • 企画が考えるスマホUIデザイン

    【Unite Tokyo 2018 Training Day】ProBuilderで学ぶレベルデザイン レベルデザインについてUnity Technologies Japan K.K.

    企画が考えるスマホUIデザイン
  • Mage Guantlet スーファミ時代のアクション RPG のテイストを忠実に再現した...

    Mage Guantlet スーファミ時代のアクション RPG のテイストを忠実に再現した iPhone ゲーム。愛情がひしひしと伝わってくるというか……当にあの時代のゲームが好きなんだろうなあと思います。 バーチャルパッドの操作性も良いです。どういった調整がなされているのか分からないですが、かなり操作しやすく出来ていると思います。

  • “愛されるスマホアプリ”を生み出す3つの要素とは――フェンリルCEOの牧野氏が指南

    国産のWebブラウザ「sleipnir」の開発で知られるフェンリルは、スマートフォンアプリの開発も手がけている。人気アプリを生み出してきた同社が考えるアプリ開発の極意とは。 スマートフォンの普及が格化する中、アプリの数も急速に増加している。しかし、星の数ほどあるアプリの中でも、ユーザーに愛され、使い続けてもらえるアプリはごく一部だ。 使われるアプリとそうでないアプリはどこが違うのか、ユーザーの評価はどこで分かれるのか――。アプリ開発者なら誰もが直面するこの疑問に答えたのが、フェンリルのCEOを務める牧野兼史氏だ。 フェンリルは、使いやすさで定評がある国産Webブラウザ「sleipnir」(スレイプニル)の開発を手がける企業で、2008年からiPhoneアプリの開発事業に参入。以降、自社アプリとしてブラウザアプリの「Sleipnir Mobile」やアドレス帳アプリ「Flick Addre

    “愛されるスマホアプリ”を生み出す3つの要素とは――フェンリルCEOの牧野氏が指南
  • iPhoneデザインボックス

    みんなが見てる人気のスマートフォン向けWebサイトデザイン

    d4-1977
    d4-1977 2011/10/22
    たっぷりまとめ
  • iOS5で搭載された新UI!UIStepper(ステッパー)の使い方 - 拡張現実ライフ

    記事内に広告を含む場合があります。記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。 こんにちは。iOS5で追加された新しいAPIをいろいろと試している@akio0911です。 今回は、iOS5で新しく追加されたUI部品「UIStepper(ステッパー)」の使い方を紹介したいと思います。 UIStepper(ステッパー)とは? iOS5で新しく追加されたUI部品です。 右側にある「ー」「+」と書いてあるのが、ステッパーです。 ステッパーの使い方 テストアプリを作りながら、解説していきましょう。 ラベルとステッパーを配置する まず、ラベルとステッパーを画面に配置します。 これがステッパーです。 こんな感じで、ラベルとステッパーを配置します。 ラベルのアウトレットを作成する ViewControllerに、ラベルのアウトレットを作成します。 #impor

    d4-1977
    d4-1977 2011/10/21
    新しいUI
  • 読了:iOS ヒューマンインターフェイスガイドライン

    Appleの「iOS ヒューマンインターフェイスガイドライン」を読んだ。 iPhone/iPadのインターフェイスとユーザー体験について解説してあるPDFである。 iPadで寝る前のちょっとした時間に読んでいたので、だいぶ時間がかかった。なにしろ、構成の練られた書籍や面白い小説ではなく、特に後半はたんたんと説明が続くので、ベッドで読むとあっという間に眠くなるのである。 しかし面白かった。 整合性を取ること(見た目と内容の整合性、標準的な動きとの整合性、アプリ内部での整合性)、アクションに対して適切なフィードバックすること、大切。 アプリもそうだけど、Webサイトでもそうですね。 iPhone/iPadに関わることだけでなく、全般的なインターフェイス、ユーザ体験に関係する記述も多い。そして抽象的なことも、iPhoneではこうなってるって具体的に説明されることで納得ができる。 設計方法からボタ

    読了:iOS ヒューマンインターフェイスガイドライン