タグ

WEBとUIに関するpipoのブックマーク (14)

  • Figmaの使い方、全力でまとめました。|hikaru-takase /Loglass

    最近、figmaを社内でも始めたのですがその魅力にドンドン引き込まれています。自身の学習も含め、これからfigmaを導入しようとする方の参考になればと思い使い方のまとめを作ってみました。 私はsketchをベースに開発することが多いのでsketch→figma視点で語ってる所が多いです。全力と言いつつ、まとめ切れていない所も多いので、不足しているところは随時更新していきます。 導入編アカウント登録 figmaの公式サイトに行きましょう!まずはアカウント登録。すべて英語ですが名前と職業を聞かれるぐらいで簡単に登録できます。またgoogleアカウントを持ってる人であれば、そちらからすぐにログインできるのでおすすめ。 ログイン後はfigmaのダッシュボードが表示されます。 webブラウザでほぼすべての機能が使えるのがfigmaの特長でもあります。 Desktop Appをインストールする やはり

    Figmaの使い方、全力でまとめました。|hikaru-takase /Loglass
  • UIデザインは奥が深い!最近のスマホアプリで見かけるアニメーションの素晴らしいアイデアを解説

    普段何気なく使用しているUIのアニメーションもその仕組みや効果を理解すると、なるほどと考えされられます。 スマホアプリのUIに使用するアニメーションをGoodな良いものから、Greatな素晴らしいものに変えるUIアニメーションのさまざまなアイデアを紹介します。 Material Motion, IBM Animation Principles, The UX in Motion Manifestoのガイドラインに基づいた、気持ちのいい操作性に優れたアニメーションを楽しむことができます。 Good to great UI animation tips 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 タブのコンテンツをスライドさせるアニメーション カードをタップして詳細を表示するアニメーション コンテンツを表示するアニメーション コ

    UIデザインは奥が深い!最近のスマホアプリで見かけるアニメーションの素晴らしいアイデアを解説
  • OpenUM Project

    OpenUMプロジェクトは、行政サービス関連標準メニュー体系「ユニバーサルメニュー(Universal Menu = UM)」の普及を通して、自治体サイトに関する「利用者」「自治体」「Web制作者」の3者を結ぶことを目指しています。 OpenUMについて OpenUMプロジェクトメンバーが調査した自治体サイトに関する調査結果や海外事例、最新のネット業界動向などを随時公開していきます。 調査データ・関連リンク 「ユニバーサルメニュー(UM)」は、市区町村等自治体による身近な行政サービスの情報を、誰もが簡単に検索・活用できるように設計した行政サービス関連標準メニュー体系です。 UMは、NPO団体アスコエが開発し、一般社団法人ユニバーサルメニュー普及協会(UM協会)が管理・運営しています。 UMのサンプルをダウンロードできます。 ユニバーサルメニュー

  • UXとは何ぞや? UXを高める武器を手に入れよう! ― 開発者は、いかにユーザー・エクスペリエンス(UX)と付き合うべきか ―

    連載目次 ◇連載の趣旨 ユーザー・エクスペリエンス(以下、UX)とは、大ざっぱにいうと、ある製品(アプリケーション)をエンド・ユーザーが使った際に経験する「楽しさ・心地よさといったプラスの感情」を、(エンド・ユーザーに提供する)価値として重視するコンセプトだ。具体的には、見た目のみではなく、使い勝手や信頼性などの側面を重視した設計を行い価値を実現する。(UXの詳細な定義については後述)。そのUXが注目されるようになって久しい。が、UXの定義や意味するところ、もたらされる恩恵は、一般の開発者レベルまで伝わっているだろうか。 開発者にUXについて尋ねると「UXはデザイナーの仕事(なので、自分には関係がない)」というような意見を持っている方に出会う。当にUXに関係のない開発者がいるのだろうか。 アプリケーションに対するエンド・ユーザーの不満を例に、不満の原因が誰の責任か見てみよう。 これら、

    UXとは何ぞや? UXを高める武器を手に入れよう! ― 開発者は、いかにユーザー・エクスペリエンス(UX)と付き合うべきか ―
  • WEBデザインとアプリデザインのためのフリーUIパッケージ「18 free UI elements packs for your web designs and apps」

    WEBデザインとアプリデザインのためのフリーUIパッケージ「18 free UI elements packs for your web designs and apps」 インターフェイスを製作するときに時間を節約しながら、クオリティを保ちたいときに、ユーザーインターフェイスに必要なパーツをパッケージした素材が便利です。今日紹介するのはWEBデザインとアプリデザインのためのフリーUIパッケージを集めたエントリー「18 free UI elements packs for your web designs and apps」です。 Modern Web UI Set 様々なタイプのUIの素材が用意されていますが、今日はその中から幾つか気になったものをピックアップして紹介したいと思います。 詳しくは以下 ■Mobility: set of mobile UI elements アプリケーショ

    WEBデザインとアプリデザインのためのフリーUIパッケージ「18 free UI elements packs for your web designs and apps」
  • https://jp.techcrunch.com/2010/12/03/20101202the-amazing-readability-of-google-maps/

    https://jp.techcrunch.com/2010/12/03/20101202the-amazing-readability-of-google-maps/
  • iUI - Google 検索

    人工授精(IUI)とは 排卵時期に調整精子を直接子宮内に注入し、妊娠率を高める方法です。 タイミング法と同じように排卵時期を予測し、人工授精の日程を決めていきます。 排卵日の直前・直後が、最も妊娠しやすい時期となります。 当日採精した精液を調整した後、濃縮精子を専用のカテーテルを用いて、子宮腔内に注入します。

  • BiND4で、空腹時に絶対見てはいけないサイトを作る! (1/3)

    記者の人生には大切なものが2つある。1つは、もう1つは事だ。大切にしすぎたせいか、iPhoneのフォトライブラリーはその2つで埋まってしまった。1000枚中、500枚余りがべものを撮影した写真だ。もはや、そういう端末だったのかとさえ思えてくる。 そこでべものの写真だ。美味しかったものをズラリと見せたい。でも、グルメサイトに投稿するのは抵抗がある。自分のサイトが作りたい。カッコイイやつを。どうせなら最新のウェブ技術で。でも知識はない。勉強する気もない。さてどうしよう。 解決策は、最新のHTML編集ソフトを使うことだ。ズルではない。これを「大人のやり方」という。時間はかけず、出来は抜群。その卑怯な願いはどこまで叶うのか。「BiND for WebLiFE* 4 プロフェッショナル版」(2万8800円)を使い、サイトをゼロから作りはじめてみた。 ■ GOHANSCII.jp(ゴハンスキー

    BiND4で、空腹時に絶対見てはいけないサイトを作る! (1/3)
  • ボストーク BOW - Google 検索

    ボストーク株式会社に寄生するプロジェクトチームの一つ。 石崎奈緒子,高橋真希子,吉川佳一の3人により2008年10月よりスタート。主にwebを中心に活動中。

  • IEやiPhoneでも問題なく動作・ドラッグやスクロール等、多方面で応用出来るjsライブラリ・Dragdealer JS - かちびと.net

    なかなか使い勝手が良さそう だったのでメモ。スクロールバー や、コンテンツスライダーなど、 多方面で応用の効くjsライブラリ、 Dragdealer JSのご紹介。 IE6、7、8や、iPhoneでも動作を確認しましたが、何の問題も無く動いてくれますよ。 ↑ 上図はスクロールバーに使用した例です。動作も凄くスムーズです。Flashでよく見かけますね。 ↑ 文字の拡大をドラッグで実装。 ↑ 斜めに移動するコンテンツスライダーにも応用できる。 ↑ こちらではコメント送信に使っています。ユニークですね。 iPhoneでは全てフリックで動作します。 IE6とか7がだいたいネックになるのでどのブラウザでも実装できるjsはいくつ覚えておいても損なさそうですね。加えてiPhoneなどでもスムーズに動いてくれるのでなかなか使えそうです。以下で動作をご確認下さい。 Dragdealer JS

  • ソシオメディア

    ソシオメディアは各種ビジネス向けデジタルプロダクトのデザイン支援を行うデザインコンサルティング会社です。業界をリードする OOUI(オブジェクト指向ユーザーインターフェース)設計、独自ガイドラインをもとにしたエクスパートレビュー、クリエイティブ組織を構築するデザインマネジメント支援など、様々な角度から御社のデザイン戦略をサポートし、デジタルトランスフォーメーションを実現します。 もっと読む 多くの方からご要望をいただいておりました OOUI メソッドの解説書『オブジェクト指向UIデザイン ― 使いやすいソフトウェアの原理』が、2020年6月5日、技術評論社より遂に出版されました。 オブジェクト指向ユーザーインターフェース(OOUI)とは、オブジェクト(もの、名詞)を起点としてUIを設計すること。タスク(やること、動詞)を起点としたUIに比べて劇的に使いやすくなり、開発効率も向上します。 ブ

    ソシオメディア
  • ぼくはまちちゃん!(Hatena) - UIについて思うこと

    ぼくはライブドアリーダーを使っていない。 なぜならそれがブラウザ上で動くものだから。 ブラウザの画面を占有するから。 ぼくがwindowsのパソコン…というか、 マルチウィンドウのパソコンを使っていて、いちばん気にするところは 「視線の移動だけで変化(新着)の概要が得られるか」 だよ。 新着メールもそうだし、 RSSリーダーもそうだね。 昔、ぼくが作った「弱酸性ミクシィ」っていう拙いソフトもそう。(これは今は動かないけど) でもバルーンとか流れるティッカーはだめ。超だめ。 あれっと思った時には、もう情報が視界から消えているし、なにより目障りだから。 ところでtwitterはいいね! なぜならあれは、IM (小さな画面) で勝手に情報を流してくれるから素敵だよね。 うん。 たぶん、みんなチャットに飢えているんじゃないかな。 だからtwitterも、ぼくの見える範囲ではチャット化しているよ。

    ぼくはまちちゃん!(Hatena) - UIについて思うこと
  • One WebへのアプローチとR&D本部のミッション | コラム | ミツエーリンクス

    ちょうど3週間前にさかのぼりますが、アップル社製のモバイル端末、iPhoneが7月11日に発売されました。当日の模様は、新聞やテレビなどでも比較的大きく取り上げられましたから、ご存じの方も少なくないでしょう。先行して欧米で発売されていたこの端末の国内販売を、首を長くして待っていた私は、発売前夜から長蛇の列に並んでまで購入した一人です。 モバイル端末向けのサイト構築とCSS iPhoneを含め、世のモバイル端末が搭載しているWebブラウザは、2種類に大別できます。一つはモバイルブラウザと呼ばれるもので、主として狭い通信帯域や小さな画面に最適化されたコンテンツを利用するのに用いられます。もう一つはフルブラウザと呼ばれ、広く一般のデスクトップPC向けにデザインされたコンテンツも十分利用できる性能を備えたものです。iPhoneの場合、後者のフルブラウザとしてSafariが搭載されています。 モバイ

    One WebへのアプローチとR&D本部のミッション | コラム | ミツエーリンクス
  • PosterousのCEO「Webはクソ。ブラウザはマジなんとかしろ」 - 昼メシ物語

    俺も使ってるお手軽日記サービスのPosterous。そのCEO、Sachin Agarwalが書いていた記事がなんとなく面白かったので和訳しました。 元の記事: The web sucks. Browsers need to innovate - Sachin's Space 部分的にかなり意訳したり強調したりしてます。以下文。 Webはクソ。ブラウザはマジなんとかしろ Webはダメダメなプラットフォームだけど、一方iPadは今後もどんどんすげーアプリがどんどん出てくるのは明らかだろう。 Web業界が長年かけて築いてきたWebサイト達よりもいいものを、どうしてiPadは最初のリリースにも関わらず出せてしまうんだろう? 「Webの終わり」を宣言するために、私はこの記事を先週から書き始めた。「Webは死んだ」とまでは言わない。でももう薄氷を踏んでる状態だ。 Webは静的なコンテンツを扱うには

    PosterousのCEO「Webはクソ。ブラウザはマジなんとかしろ」 - 昼メシ物語
  • 1