調べてみたtokyoユーザビリティダメ出し東京へ行くときにいつも利用しているビジネスホテルが、今回は予約できませんでした。いい機会なので、開業したばかりの超オシャレカプセルホテル「ナインアワーズ赤坂」にに連泊することにしました。開業直後の京都店に宿泊したことがあり、久しぶりでした。結論から言うと、ナインアワーズ赤坂は、連泊や、荷物が多い旅行には全く向いていません。赤坂店には重要な問題が複数あり、かなり厳しいレビューをしなければなりませんが、敢えて正直に書きます。睡眠が快適すぎる開業時から変わらず、カプセル=スリープポッドの性能がすばらしかったです。二晩とも横になった途端に爆睡しました。枕元には交流電源だけでなく、USB電源があります。物が置けるスペースもありますが、ごく小さいものしか入りません。身の回り品は足元にカバンを置くことになりますが、充分足を伸ばせるので許容範囲かなと思います。ハンドバッグひとつで寝るだけであれば、ナインアワーズは最高です。いうか、それがカプセルホテルの本来の役割だったのですが。シャワーナインアワーズには浴場はありません。そのかわり、充分な数のシャワーが用意されているため、満員になる心配はありません。シャワーはオシャレですが、ハンドルのどこにも出っ張りがなく、手に石鹸がついているとひねるのがとても難しいです。場所が場所だけに写真を撮れませんでしたが、「デザインの敗北」といった感じです。洗面所、アメニティシャワーは充分なのに、洗面所が足りていません。朝は混雑して大変でした。アメニティはハンドソープのみで、洗顔料、化粧水などは用意されていません。そのくらいは持参するので問題ないのですが、コップもないので薬も飲めません。休憩できないポッドを外から見せる設計にした、赤坂店のみの問題と思いたいですが、明らかに共有部に対してポッドが多すぎます。人が多すぎて落ち着かないです。休憩スペースは一階のコーヒーショップのカウンターのみです。玄関にベンチがありますが、人の出入りが頻繁なので落ち着きません。自販機は外なので、着替える前に飲み物を買っておく必要があります。トランクを開けられないロッカールームが狭く、かつブロックごとに廊下のどんつきにあります。説明が難しいので雑な図を書くとこんな感じです。絵が下手でエレベーターの前が空いているように見えますが、実際は、壁際には海外旅行者の巨大なトランクがびっしり置かれています。この構造だと、ロッカーの前でトランクを開けることになりますが、狭い廊下をトランクが塞いでしまうので、同じブロックの他の人がロッカーを開けられなくなってしまいます(つまり10人いたら2人くらいしか開けられない)。常に空気の読み合いが発生し、朝は戦場でした。公式サイトの写真を見た限りでは、神田店(ウーマン神田)はこの問題が出にくい構造になっています。セキュリティ問題これを書いて大丈夫かと思いますが...朝、洗面所に男性が入ってきて歯磨きをはじめました。スタッフともLGBTの人とも思えません(男性スタッフは午前3時〜4時に来ます)。男性の洗面所が混んでいたから女性用の方に来たのかもしれません。男女のエレベーターが隣同士で、かつフロントから死角になっているので、異性のフロアに簡単に侵入できてしまうことに気付きました。今のところ問題が起きていないと思いたいですが、なんらかの見直しをした方がいいのではと思いました。まとめ「ナインアワーズ赤坂」の感想は以上です。二泊以上には今後利用しないと思います。そもそも連泊をするような施設ではない、としても、飲みすぎてかばんひとつで宿泊するような使い方では、今度はアメニティが少なすぎる問題があります。夜や朝にポッドから出て見る幻想的な景色、美しく海外の人でもまったく迷わないサインボードなど、デザイン性についてはほんとうにすばらしいです。デザインと宿泊施設としてのユーザービリティの共存を願うばかりです。Designの思想でフレームワークを作ってみたい」という記事を書いたところ、とてもたくさんの感想をいただきました。ウェビンブログ大半がフロントエンドエンジニアからの突っ込みです。著名な方々にもたくさん意見をいただいただのでまとめました。ありがとうございます。Designの設計は、デザインレベルからの意思統一が可能な環境でなければ破綻してしまいます。私はデザインを外部に発注することが多いですし、CMSベースで構築すると、どうしてもマークアップやクラスの命名に手を出せない箇所が出てきます(※)。Designを採用することは諦めて、既存のCSS設計を、専門のマークアップエンジニアではなくても理解しやすくする方向で考え直すことにしました。cmsの魅力は、公開サイトからデザインの異なる管理画面へ移動せずにエントリーの投稿ができるところにあります。日本での利用を前提としたUIもわかりやすく、クライアントさんからの評価も高いです。投稿画面のユーザーインターフェースのCSSも丁寧に作られているのですが、導入するサイトのCSSルールによっては衝突が起こる場合があります。cmsの投稿画面は、冒頭の画像のように見た目が崩れてしまいます。bodyにセリフ系、デザイン系のフォントを指定しているbodyの文字サイズを「0.625rem(=10px)」として、各モジュールは「140%」などの相対%で調整しているこれらをはじめとする細かい問題を回避するCSSをGistで公開しました。バージョン2.6時点の、公開ページでの投稿フォームなどの既存CSSとの衝突を修正するための追加CSSこちらからも、2017年1月19日時点のバージョンをダウンロードできます。以下のとおり、本来の「acms.css」に続けて読み込んでください。href="/css/acms_ex.css">このCSSは、以下の問題の修正と、外観の調整を行います。管理ボックスのボタンサイズを固定ユニット内のラベルのクラス名がbootstapと重複している問題を回避acms.css以外のフレームワークを使用すると予期しない箇所で段組が解除されてしまう問題を回避エントリーカスタムフィールドのラベルを長いタイトルにも対応させるファイルユニットになぜかインラインでwidthが入ってしまう問題を回避ツールチップアイコンをエントリー・モジュールのカスタムフィールドでも使用できるようにする文字装飾ボタンを目立たせる「本文のフォントをacms.cssのフォントに合わせる」「予期しない箇所で段組が解除されてしまう」「文字装飾ボタンを目立たせる」については必要ないケースもあると思うので調整してください。「ファイルユニットになぜかインラインでwidthが入ってしまう問題」については今後のバージョンで修正される可能性があります(先日リリースれた2.6.1.4では未確認です)。その場合はこちらは逆に不具合の原因になるかもしれません。私はいちからすべてテーマを制作する案件だけでなく、すでに制作会社さんによってコーディングが終わったサイトにCMSを組み込む案件も多数請け負っています。この調整CSSは、そのような案件を通してちょっとずつ書き足していったものです。個人的には10pxから文字サイズを調整する手法は開発者側の計算が楽になるものの、改修や外部サービスのパーツ追加に弱いので避けるべきと思います。いった導入先サイトのスタイルの問題だけでなく、最近のCSSフレームワークで見られる「ワイド画面でサイト全体の文字サイズが大きくなる」効果によって「良かれと思って作られているものがacms.cssと衝突する」というケースもあり、やはりサイトに応じて制作側が細やかに調整していくしかないと思います。「そこまでするの?」「フォントなんて気にしなくても...」という意見もあるでしょうが、私は可能な限り徹底したいと考えています。CMSを扱うクライアントの不安をできるだけ払拭するのが、CMS構築を担当する私の役割でもあるからです。調べてみたWordPressMovableTypeablogcmsconcrete5DrupalbaserCMSユーザビリティこれまでのコーポレートサイトのCMS構築において、ナビゲーション機能は重要度が高くありませんでした。公開後に変更されることが少ないので、HTML直書きでも充分だったのです。コンテンツマーケティングの考え方が普及し、サイト公開後もナビゲーションの導線変更を検討するケースが増えてきました。現時点の、日本国内の主要CMS6ブランド・7種類の「ナビゲーション機能」について改めて見直してみました。2016-12-30追記ユーザーの皆さんから情報をいただき、下記を修正しました。望みのパーツをどこにでも。cmsの「カスタムユニット」の使い方これはいいチュートリアルablogcmsユーザビリティCMSで更新する予定のコンテンツで、上の画像のように「『お客様の声』や『ボタン』のパーツを、本文中の好きな場所に表示したい」と要望があったら、どう対応しますか。カスタムフィールドだと、表示位置をあらかじめ固定しなければなりません。WordPressの「AddQuicktag」や、ウィジウィグのテンプレート機能は、HTMLを編集できるためページが崩れる危険性が高くなります。Builder」なら解決するように思えます。いずれも独自の入力欄を持ったパーツを作ろうとすると、専用のプログラムを書くことになり、制作コストがかかります。cmsはバージョン2.1から、自作のユニット(パーツ)を追加できる「カスタムユニット」機能が追加されました。どちらも幸せにする、おすすめの機能です。使い方を詳しくご紹介します。「望みのパーツをどこにでも。結婚のご報告とお知らせ。