( ! ) Deprecated: strip_tags(): Passing null to parameter #1 ($string) of type string is deprecated in /home/jlahijani/Sites/goodui.org/site/templates/_og.php on line 13 Call Stack #TimeMemoryFunctionLocation 10.0000465624{main}( ).../index.php:0 20.06312252664ProcessWire\Wire->__call( $method = 'execute', $arguments = [0 => TRUE] ).../index.php:55 30.06312252664ProcessWire\WireHooks->runHooks( $object = class ProcessWire\ProcessPageView { }, $method = 'execute', $arguments = [0 => TRUE], $type = ??? ).../Wire.php:484 40.06312253080ProcessWire\Wire->_callMethod( $method = '___execute', $arguments = [0 => TRUE] ).../WireHooks.php:952 50.06312253080ProcessWire\ProcessPageView->___execute( $internal = TRUE ).../Wire.php:416 60.07022293384ProcessWire\ProcessPageView->renderPage( $page = class ProcessWire\Page { public $id = 3145; public $name = 'redesign-booking-com-room-table'; public $parent = '/blog/'; public $template = 'post'; public $title = 'Redesign: Booking.com Room Table'; public $post_tags = '(PageArray) '; public $body_blocks = '(RepeaterMatrixPageArray) 6539'; public $date = 1440429443; public $comments = '(CommentArray) '; public $summary = ''; public $body = ''; public $data = ['title' => 'Redesign: Booking.com Room Table', 'post_tags' => class ProcessWire\PageArray { ... }, 'body_blocks' => class ProcessWire\RepeaterMatrixPageArray { ... }, 'date' => 1440429443, 'comments' => class ProcessWire\CommentArray { ... }, 'summary' => '', 'body' => ''] }, $request = class ProcessWire\PagesRequest { } ).../ProcessPageView.module:114 70.08242323520ProcessWire\Wire->__call( $method = 'render', $arguments = [] ).../ProcessPageView.module:184 80.08242323520ProcessWire\WireHooks->runHooks( $object = class ProcessWire\Page { public $id = 3145; public $name = 'redesign-booking-com-room-table'; public $parent = '/blog/'; public $template = 'post'; public $title = 'Redesign: Booking.com Room Table'; public $post_tags = '(PageArray) '; public $body_blocks = '(RepeaterMatrixPageArray) 6539'; public $date = 1440429443; public $comments = '(CommentArray) '; public $summary = ''; public $body = ''; public $data = ['title' => 'Redesign: Booking.com Room Table', 'post_tags' => class ProcessWire\PageArray { ... }, 'body_blocks' => class ProcessWire\RepeaterMatrixPageArray { ... }, 'date' => 1440429443, 'comments' => class ProcessWire\CommentArray { ... }, 'summary' => '', 'body' => ''] }, $method = 'render', $arguments = [], $type = ??? ).../Wire.php:484 90.08252325480ProcessWire\Wire->__call( $method = 'renderPage', $arguments = [0 => class ProcessWire\HookEvent { public $data = [...] }] ).../WireHooks.php:1060 100.08252325480ProcessWire\WireHooks->runHooks( $object = class ProcessWire\PageRender { public $data = ['clearCache' => 1] }, $method = 'renderPage', $arguments = [0 => class ProcessWire\HookEvent { public $data = [...] }], $type = ??? ).../Wire.php:484 110.08252325896ProcessWire\Wire->_callMethod( $method = '___renderPage', $arguments = [0 => class ProcessWire\HookEvent { public $data = [...] }] ).../WireHooks.php:952 120.08252325896ProcessWire\PageRender->___renderPage( $event = class ProcessWire\HookEvent { public $data = ['object' => class ProcessWire\Page { ... }, 'method' => 'render', 'arguments' => [...], 'return' => NULL, 'replace' => FALSE, 'options' => [...], 'id' => 'Page:100.0:render', 'cancelHooks' => FALSE, 'when' => 'after'] } ).../Wire.php:416 130.08322326456ProcessWire\Wire->__call( $method = 'render', $arguments = [] ).../PageRender.module:575 140.08322326456ProcessWire\WireHooks->runHooks( $object = class ProcessWire\TemplateFile { public $data = ['wire' => class ProcessWire\ProcessWire { ... }, 'classLoader' => class ProcessWire\WireClassLoader { ... }, 'hooks' => class ProcessWire\WireHooks { ... }, 'config' => class ProcessWire\Config { ... }, 'notices' => class ProcessWire\Notices { ... }, 'urls' => class ProcessWire\Paths { ... }, 'log' => class ProcessWire\WireLog { ... }, 'sanitizer' => class ProcessWire\Sanitizer { ... }, 'datetime' => class ProcessWire\WireDateTime { ... }, 'files' => class ProcessWire\WireFileTools { ... }, 'mail' => class ProcessWire\WireMailTools { ... }, 'database' => class ProcessWire\WireDatabasePDO { ... }, 'db' => class ProcessWire\DatabaseMysqli { ... }, 'cache' => class ProcessWire\WireCache { ... }, 'modules' => class ProcessWire\Modules { ... }, 'procache' => class ProcessWire\ProCache { ... }, 'fieldtypes' => class ProcessWire\Fieldtypes { ... }, 'fields' => class ProcessWire\Fields { ... }, 'fieldgroups' => class ProcessWire\Fieldgroups { ... }, 'templates' => class ProcessWire\Templates { ... }, 'pages' => class ProcessWire\Pages { ... }, 'permissions' => class ProcessWire\Permissions { ... }, 'roles' => class ProcessWire\Roles { ... }, 'users' => class ProcessWire\Users { ... }, 'user' => class ProcessWire\User { ... }, 'session' => class ProcessWire\Session { ... }, 'input' => class ProcessWire\WireInput { ... }, 'buster' => class ProcessWire\ProCacheBuster { ... }, 'process' => class ProcessWire\ProcessPageView { ... }, 'page' => class ProcessWire\Page { ... }, 'options' => [...]] }, $method = 'render', $arguments = [], $type = ??? ).../Wire.php:484 150.08322327808ProcessWire\Wire->_callMethod( $method = '___render', $arguments = [] ).../WireHooks.php:952 160.08322327808ProcessWire\TemplateFile->___render( ).../Wire.php:413 170.17092864336require( '/home/jlahijani/Sites/goodui.org/site/templates/_main.php ).../TemplateFile.php:340 180.17192890624include( '/home/jlahijani/Sites/goodui.org/site/templates/_og.php ).../_main.php:64 190.17372892640strip_tags( $string = NULL ).../_og.php:13 " />

Redesign: Booking.com Room Table

Booking.com offers guests a wide range of trusted hotels, apartments and villas to choose from, for shorter duration stays. As great as the service is, they do however have one particular screen that could benefit from some extra UI love. Specifically, it's the room selection table which occasionally becomes complex and so we redesigned it. Here is a best shot sketch with a number of applied GoodUI ideas:

Before & The Current Room Table

Variations
The existing room table selection appears mid page when users open a specific hotel page. For the most part, these room tables are quite simple, with fewer choices. In other cases, as higher number of guests and separate room preferences are chosen, the tables do become quite long (as seen above).

After & What Could Be

Changes
A number of conceptual improvements have been sketched out based on some of the GoodUI ideas already explored. These include: 1 A more reassuring headline to recommend the best room grouping, instead of just having a long list of equal room options. We assumed that guests wish to be reassured of being able to sleep comfortably for a number of nights, in a number of rooms, and see the best combination right away. 2 Various room options (such as pay later, breakfast, etc) were also collapsed into single blocks. Therefore the sketch reinforces the conceptual model of one room being visually represented as a single block - simpler. The room name is then followed up with a sub-headline showing how many people will sleep in that room (making the relationship between rooms & people stronger). 3 Having a single price per room was further clarified with explicit copy such as "$x per room / per night". Although that is the standard pricing, there are some cases where rooms are priced per person. 4 Each room now has two sets of options - ones which are included as part of the price, and ones which can be added for an additional fee. The additional benefit of horizontally spacing these options out is that it makes their position easier to predict and therefore compare across rooms. As these additional room options are now actually optional as checkboxes, the complex multi dimensional decision making (of rooms and options) disappears. 5 At the very bottom of the room recommendation, the primary call to action is then summarized and made clearly visible. 6 The remaining rooms have been separated out as clear alternative choices to pick from at the very bottom.

Get Your Key Screens Redesigned As A Rapid Sketch
We do offer Rapid Advice where we'll apply UI design best practices to any of your key business pages.



Comments