Disclaimer: Document is not indicative of final graphic design, colour and exact scale.

For identification of elements & their relationships only.

Confidential and Secure Handling Required
Page 7 of 11
Bits and Pieces
Version: 1.0 | Published: November 08, 2013 | Created By: Shanak Rahman (srahman@kobo.com)
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Smartcrop for Website Pinned Items
Landscape
Oriented
Pictures.
Portrait
Oriented
Pictures
Facebook OG Title meta tag, spanning as
many lines as needed
domainURL.com
Facebook OG Title meta tag,
spanning as many lines as
needed as many lines as
needed as many lines as
needed
domainURL.com
1 Smart cropping: Landscape
The image that is retrieved from the website will
determine the layout of the pinned item itself.
There will be a default size and aspect ratio to the
image, and we will crop the image such that it ts
the area perfectly.
As the user resizes the pinned item, it expands via
aspect ratio. This will remove the grey
backgrounds and odd padding introduced by
allowing various aspect ratios.
1
2 Smart cropping: Portrait
The image that is retrieved from the website will
determine the layout of the pinned item itself.
There will be a default size and aspect ratio to the
image, and we will crop the image such that it ts
the area perfectly.
Portrait images will have a different orientation, to
introduce variability in pinned website images
2