タグ

WEBデザインに関するnazokingのブックマーク (56)

  • @IT:ユーザーが選びやすいフォームのカタチを考えよう

    Webアプリケーションのユーザーインターフェイス[2] ユーザーが選びやすい フォームのカタチを考えよう ソシオメディア 上野 学 2005/6/24 前回「ユーザーにとっては “ユーザーインターフェイス”こそが製品そのもの」は、ユーザーインターフェイスというもののとらえ方と、それをデザインするうえでは、人とシステムとの対話であるインタラクションデザインを論理的に行わなければならないという話をしました。今回は、GUIをデザインするうえで必要な前提知識と、Webアプリケーションの課題、そしてウェブアプリケーションにおけるインタラクションの要となるフォームコントロールについて考えていきたいと思います。 ■WIMPインターフェイス GUIは、別名「WIMPインターフェイス」とも呼ばれます。WIMPとは、ウィンドウ(W)、アイコン(I)、メニュー(M)、ポインター(P)のことで、GUIを構成する代

  • Sensitive... Google風ロゴの作り方

    Googleのロゴで使われているフォントは「Catull」という名前らしいです。書体のサンプルは IdentiFont にあります。(この書体自体は残念ながら有料です。)書体が手に入らなければ、別の書体で試してみてください。 次にGoogle風ロゴの作成ですが、想像していたよりも作り方は簡単です。慣れてしまえば5分で出来上がるはずです。どのように作っているかは下のPSDファイルを開いてみてください。今回はPhotoshopを用いて作りましたが、使っているフィルタは「ドロップシャドウ」と「ベベルとエンボス」の二つだけなので、フリーのソフトでもこの機能があれば十分作れると思います。上下のロゴはPhotoshopを使って実際に作成したものです。 → Google風SensitiveとGoogleロゴのPSDファイル ※フォント情報はラスタライズしてあります。 上のSensitiveのサンプルがト

    Sensitive... Google風ロゴの作り方
    nazoking
    nazoking 2005/07/02
    フォントは「Catull」Photoshop「ドロップシャドウ」と「ベベルとエンボス」
  • Adobe - デベロッパーセンター : Dreamweaver 拡張機能 for Movable Type 3によるテンプレートカスタマイズについて

    はじめに ウェブログが注目されている理由は、以下に挙げられるように、ウェブにおける表現の自由が個人レベルまで高められた点にあります。 誰もがカンタンに投稿し即時にウェブ公開できる ウェブサイトの更新情報を RSS 技術により効率的に配信できる 検索エンジンとの親和性が高い Movable Type (ムーバブル・タイプ) は、シンプルでカスタマイズ性が高いと定評のあるウェブログ作成ソフトウェアです。図1のように投稿データと出力用のテンプレートを個別にデータベースへ格納し、公開のタイミングにデータベースより取得した投稿データとテンプレートを使い、XHTML とスタイルシートを自動生成します。 図1 これまで、Web 制作を自社で行わない企業などは、デザインの変更・ウェブコンテンツの更新作業を Web の制作会社に依頼しなければなりませんでした。結果、制作会社へかかる負担は大きいものとなり、

    nazoking
    nazoking 2005/07/02
    コードヒント,アトリビュート挿入ダイアログ,Movable Type タグリファレンス
  • http://svslab.jp/0x0a/20050611.html

    nazoking
    nazoking 2005/07/02
    クリックの回数を増やすこと自体がWebサイトのコンテンツの印象によい影響を与える可能性がある
  • CSS Filters - CSS-only Filters Summary (dithered.com)

    nazoking
    nazoking 2005/07/02
    CSSの非互換性を利用してブラウザ振り分けテクニック、いろんなブラウザでの対応表
  • @IT:Webアプリケーションのユーザーインターフェイス[1]-1

    Webアプリケーションのユーザーインターフェイス[1] ユーザーにとっては “ユーザーインターフェイス”こそが製品そのもの ソシオメディア 上野 学 2005/6/2 ■はじめに Webクライアントの技術が進歩し、多様化するに従って、Webベースのシステムにはデスクトップアプリケーションと同等の品質を持つユーザーインターフェイスが必要となってきています。 しかし開発の現場では、ユーザーインターフェイス(特にGUI)デザインについての専門的なスキルを持った技術者が圧倒的に不足しています。その理由は、ソフトウェア製品におけるユーザーインターフェイスの重要性が正当に理解されていないためと、ユーザーインターフェイス・デザインに関する教育機会がほとんどないためです。 利用者の視点に立てば、ユーザーインターフェイスとは製品そのものです。いくら高度に洗練された仕組みがバックエンドにあったとしても、それが

  • Downloads

    This section has been lost in the depths of Internet history. Please check the Internet Archive instead. www.skyzyx.com/downloads downloads.skyzyx.net

    Downloads
    nazoking
    nazoking 2005/07/02
    いろいろなバージョンのスタンドアロンで動くIEがダウンロードできる
  • ecjapan.jp

    This domain may be for sale!

  • 検索の思考モデルはさらに堅固になっている

    ユーザは現在、検索の動作に対して明確な期待を持っている。その思考モデルに訴えるデザインでありながら、異なる動作を行うものは混乱を招く。 Mental Models For Search Are Getting Firmer by Jakob Nielsen on May 9, 2005 検索は、ウェブのユーザ行動の中であまりにも突出したものであるため、それがどのように動作するべきかという、堅固な思考モデルをユーザたちは形成している。彼らは3つのコンポーネントが検索機能を構成していると思っている。 検索文字列を入力するためのテキストボックス。 「検索」というラベルのついた、検索を作動させるために押すボタン。 別ページに設けられた、リニアで優先順位がつけられた上位候補一覧—検索結果ページ(SERP) ユーザテストでウェブサイトやイントラネットでの検索が、Xのように動作したほうがよいと、人々は訴

    検索の思考モデルはさらに堅固になっている
    nazoking
    nazoking 2005/07/02
    ユーザは現在、検索の動作に対して明確な期待を持っている。その思考モデルに訴えるデザインでありながら、
  • fladdict.net blog: flash使いから見た、ajaxのユーザビリティ(1)

    ajaxにおけるユーザビリティについて、flash使いの視点から書いてみる。 おそらくは、ajaxに携わる人の99%はプログラマやSEだと思うので、プログラマの言葉でデザインについて語ってみるテスト。今回は遷移について。 如何に遷移状態を知覚可能にするか 非同期通信のユーザビリティにおいて最も重要なことはおそらく、ユーザーに対し如何に状態繊維を意識させるか?ということではないかと思います。 「せっかくのシームレスな環境で、何故わざわざ遷移を意識させなければいけないのだろうか?」 と不思議に思う方も多いと思いますが、実はシームレスな環境だからこそ、遷移を意識させなければならないのです。 シームレスに遷移が行われるということは、同時にユーザーが現在位置を見失う可能性があるということでもあります。ロードが終了したのに気付かずに、いつまでも待っているというようなものはカワイイもので、例えばマウスオ

    nazoking
    nazoking 2005/07/02
    デザインを通じて、変化を明示してやる必要がある。非同期通信アプリは、シームレスな遷移でユーザーの体験
  • http://www.yasuhisa.com/could/entries/000724.php

  • MBoffin.com - Designline - A Design Timeline

    I have often wondered what it would be like to see a web site design progress from start to finish, with each tweak and change being shown as it progresses—a design timeline, if you will. I don't mean from conceptual start to finish—from blank piece of paper to finished Photoshop image of the design. I mean from a blank browser and text file to a completed HTML file with associated CSS and images.

    nazoking
    nazoking 2005/07/02
    HTMLにCSSと画像を組み合わせてサイトをデザインしていく過程をアニメーションGIFで再現
  • 正しいアダルトサイトの作り方

    正しいアダルトサイトの作り方「正しいアダルトサイトの作り方」は成人向けに作られたページです。18歳未満の方はこちらより速やかに退出願います(注意/免責事項)。 アダルトサイトを作る場合、非アダルト系と異なり、様々な点に注意を払わなくてはなりません。「エロサイトは、アクセスが多そうだから、サイトを立ち上げれば儲かるんじゃないの?」といった甘い幻想を抱くだけではいけないのです。社会のルール(法律)を知らずに違法なHPを作成すれば、1ヵ月後に警察のおじちゃんが訪ねてくる、なんてこともあるかもしれません。また、ただ闇雲に作成してもアクセスは向上しませんし、収入も見込めません。 当サイトは、「普通のホームページは作成できても、アダルトサイトは作ったことがない、作るのはちょっと不安」といった方々のための作成解説マニュアルです。特に「法律に触れない、損害賠償の対象とならない、ウィルス侵入に負けない」よう

    nazoking
    nazoking 2005/07/02
    「普通のホームページは作成できてもアダルトサイトは作ったことがない、作るのはちょっと不安」といった方
  • WYSIWYG型がブログをダメにする? | Webデザインのタネ

    一定期間更新がないため広告を表示しています

    WYSIWYG型がブログをダメにする? | Webデザインのタネ
    nazoking
    nazoking 2005/07/02
    WYSWYG型というのは、見たものを見たとおりに出力する性質上、文章の構造が見えづらくなって、書き手の文章力
  • 塊魂オンザウェブ

    2018/9/14 「塊魂アンコール」がNintendo Switch™とSTEAM®で発売決定!詳しくはコチラ 塊ラインナップを更新しました 2013/4/25 「塊魂 ノ・ビ~タ PlayStation®Vita the Best」が2013年4月25日にお得な価格で日発売!!! 2012/11/27 塊魂 オンザウェブ、塊ラインナップを更新しました 2012/11/21 PlayStation®2アーカイブスにて「塊魂」配信開始 詳しくはコチラ 2012/9/11 塊魂 オンザウェブ、塊博士2のくだらない話を更新しました 2012/9/4 塊魂 オンザウェブ、塊博士2のくだらない話を更新しました 2012/8/28 塊魂 オンザウェブ、塊博士2のくだらない話を更新しました 2012/8/21 塊魂 オンザウェブ、塊博士2のくだらない話を更新しました 2012/8/17 塊魂 オンザ

    nazoking
    nazoking 2005/07/02
    手書き+イラスト+縦長
  • Lucky bag::blog: float の問題を overflow で解決

    float させた要素を内包したボックスは、高さを指定しないと下方に伸びません。これを、clear を使わずに overflow で解決しちゃう方法。 CSS - Clearing floats 簡単に説明してみます。container 内に left と right があり、それぞれを左右に float させています。で、実はcontainer に背景色 #ddffbb を指定しているのですが、反映されてません。 floatサンプル01 container 自体の高さを指定していないので、下方に伸びないからです。これを解決するためには、(X)HTML に手を加えて clear させるしか方法はありませんでした。 floatサンプル02 しかし、container に幅と overflow を指定すれば解決します。 #container { background-color: #ddffb

    nazoking
    nazoking 2005/07/02
    container 内に floatさせたleftとrightがありcontainerが小さいとき、containerが途中で切れる。この場合containerの最後にcl
  • Usable XMLHttpRequest in Practice

    Please enter your email and we will send you an email where you can pick a new password. Welcome to Baekdal/Plus Baekdal/Plus is for journalists and editors who want to be more relevant to their readers. Each edition of this weekly newsletter focuses on ways you can help improve your coverage, avoid mistakes that are known to drive people away, and overall create something more useful for people t

    Usable XMLHttpRequest in Practice
    nazoking
    nazoking 2005/07/02
    ユーザビリティーを上げるためのajax/DHTMLの使いどころ。入力できるエレメントの強調、入力中のエレメントの
  • graffiti.net

    graffiti.net 2024 著作権. 不許複製 プライバシーポリシー

    nazoking
    nazoking 2005/07/02
    IEで丸い角を表現するためにVMLのroundrectを利用します。とりあえずCSS3で書いた(-moz-)border-radius なスタイルシ
  • 0503 - eto.com/d

    ContentsDebugWindow注目をあびる優れた検索エンジンwemaNifty Corners++ Updateダウンロードniftypp.htmlniftypp2.css議論リンクsIFRNifty Corners++download使い方で、Buzz GameGiant StepsRuby on RailsGonzui CSS対応Gonzui JavaScript対応JavaScript at SourceForgeTinyMCEIE7HtmlAreaGoogle MapsAlphaImgFactoryAjaxversionの違い動的生成使いまわしがききそうな部分他の分析2005-03-18AjaxAjaxを説明する時に絶対使ってはいけない用語VML誰も知らないけど実はイケてる技術で、Mozilla SVGRealtimeWikiWikiばな Vol.4RastBreak it

    nazoking
    nazoking 2005/07/02
    Google Mapsのソースを読む
  • http://dac.lolipop.jp/blog/archives/000259.html

    nazoking
    nazoking 2005/07/02
    凄いHTMLソース。やりたいんだったらMozilla独自実装で我慢しておくか、CSS3の'border-radius' propertiesの実装を待つか