タグ

ブックマーク / note.openvista.jp (5)

  • 東京の鉄道路線図SVGを作りました&パブリックドメインで配布します

    東京の鉄道路線図SVGを作りました&パブリックドメインで配布します ロンドン地下鉄路線図での作図方法に基づいた東京の鉄道路線図を作ったので公開・配布します time2014/12/20 hatenabookmark- Illustratorを使って、東京圏の交通路線図を作りました。 現在、これを書きだしたSVGファイルを以下に置いて、ウェブ上から見られるようにしています。まだマップとして大した処理はしていないので、PCとかだとスクロールが面倒ですが、スマートフォンなどタッチ端末だとそこそこ見られると思います。 なお、AIファイル・SVGファイルはパブリックドメイン(CC0)としますので、配布・改変・販売含め、煮るなり焼くなり好きに使っていただいてかまいません。 railmaps - github どうして描いたの? 昔からハリーベック氏のロンドン地下鉄路線図がとても好きで、自分もこういうも

  • そこそこユーザビリティの高いフォームを作った

    そこそこユーザビリティの高いフォームを作った 入力内容の検証とか、郵便番号変換を備えた、そこそこ使いやすいフォームのテンプレートを作りました time2014/01/18 hatenabookmark- 去年末実家に帰省していた時に、jQueryの練習&業務で使うために、フォームバリデーションとか郵便番号変換とかを備えた、そこそこユーザビリティの高い入力フォームをコーディングしていたので、ここで公開しておきます。 フォームサンプル ソースお持ち帰り用 (Github) ここで"そこそこ"と言っているのは、もともと業務でユーザビリティ改善案として使うことが目的であって、ベストを目指してもサーバ制約やコスト的な観点で使えないことがあるから、そこは目指さないよという意味です。そもそも、フォームは必要悪ですし、ベストはフォームが存在しないことですね。 フロントエンド実装だけです(サーバ側スクリプト

  • 良いユーザ体験を目指すためにはアクセシビリティが大事だという話

    良いユーザ体験を目指すためにはアクセシビリティが大事だという話 アクセシビリティが大事なのは、良いユーザ体験を実現するために必要となる情報にアクセスできることが前提となるためです time2013/03/11 hatenabookmark- ユーザ中心デザインとか、ユーザ体験デザインとかの勉強をしてかれこれ3年くらいになるんですが、そのためには情報のアクセシビリティが良くなることが特に大切だと最近は思ってるんですね。 で、今日はその理由とか、じゃあどうアクションするよ、みたいなところを書いてみます。 Google glassとアクセシビリティ まずは、「アクセシビリティとユーザ体験ってどう関係あるのよ??」と思った人向けに小話をひとつ。 少し前にGoogleのメガネ型情報機器 Google Glass(以下、Glass)のデモ動画が公開されて、話題になりましたね。面白い動画なので未見の人は

  • 記事を読んでもらうために要約をつけよう

    記事を読んでもらうために要約をつけよう 多くのウェブサービスで文の抜粋が使われていますが、内容を把握するには十分ではない、ということをビフォーアフターで考えてみます。届けたい人に情報を届けるために要約をきちんと書いておきましょう time2013/01/27 hatenabookmark- ウェブ上のデザインパターンとして、あるページ(URL)に対して何か言及するというものがよく見られます。 そこでは、おそらく読者が内容を推測しやすいように(読むべきかどうかを判断しやすくする)という配慮からか、ページ内容の"抜粋"を入れています。 しかし、この抜粋って内容をある程度つかむためにどこまで有用なのでしょうか。ちょっと例を挙げながら見て行きましょう。 抜粋表示の一例 facebookの例。冒頭の数百時が使われています。タイトルにある3つの設計思想が書かれていればよりわかりやすかったですね。 こ

  • 勝手にリデザイン:新宿高層ビルの館内施設案内板

    勝手にリデザイン:新宿高層ビルの館内施設案内板 新宿のとある高層ビルの館内案内標識が話題に。後学のために、仕様・問題点を整理、改善案の作成を行ってみました time2011/09/08 hatenabookmark- Twitterで、あるサイン(案内板)のことが話題になっていました。新宿のあるビルの案内図のようですが、わかりづらいことが問題になっているようです。 …確かにこれはわかりません。トイレを探している時に遭遇したら結構辛いと思いますね。でも、なぜわかりにくいのか、どういう改善案が考えられるのか、もう少し考えてみることにしました。 仕様 まず、この図から読み取れる情報だけでは何が「正解」かわからないので、実際の現場に足を運んでみました。 そして、館内をぐるっと見学してみて、大体の施設の配置を把握してきました。(ちなみに、ビルの中をウロウロしてると普通に不審者だと思うので、警備員の方

  • 1