{"id":111,"date":"2024-02-23T20:51:40","date_gmt":"2024-02-23T20:51:40","guid":{"rendered":"https:\/\/flostor-prototypes.leesonresearch.com\/?p=111"},"modified":"2025-02-07T19:29:40","modified_gmt":"2025-02-07T19:29:40","slug":"case-study-mobile-comparisons","status":"publish","type":"post","link":"https:\/\/flostor-prototypes.leesonresearch.com\/?p=111","title":{"rendered":"Case Study Comparisons on Mobile and Desktop"},"content":{"rendered":"\n

Case Study Comparison on Mobile<\/h3>\n\n\n\n

Note how the text wraps around the images. On desktop wrapping text around images is not optimal but you can get away with it. On mobile wrapping text around images looks less than optimal on mobile devices. To fix this I will need to rebuild all the case study pages.<\/p>\n\n\n\n

When you scroll down the Dematic case study on the left notice how large the images are and how easy their images are to read whereas on the Flostor case study on the right the images are smaller, consequently they don’t read that well on mobile.<\/p>\n\n\n\n

The small images that are currently on the Flostor case study pages are sized too small in comparison to the images on the Dematic case study where the images fill the full width of the browser which in my opinion is more compelling. <\/p>\n\n\n\n

To fix the image widths requires rebuilding all the case studies.<\/p>\n\n\n\n

Note how the larger font size on the Dematic case study is much easier to read than the font size on the Flostor case study.<\/p>\n\n\n\n

\"Case\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n
\n
\n

https:\/\/www.dematic.com\/en-us\/insights\/case-studies\/westrac-tomago-australia\/<\/a><\/p>\n<\/div>\n\n\n\n

\n

https:\/\/flostor.com\/case-studies\/qsc2.html<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\n

Case Study Comparison on Desktop<\/h3>\n\n\n\n

On desktop I’m thinking that the font size Dematic is using is a bit large, the font size could be brought down a little bit. <\/p>\n\n\n\n

The font size on Flostor in my opinion is too small and harder to read even on desktop. I would suggest that we make the font size bigger.<\/p>\n\n\n\n

\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n
\n
\n

https:\/\/www.dematic.com\/en-us\/insights\/case-studies\/westrac-tomago-australia\/<\/a><\/p>\n<\/div>\n\n\n\n

\n

https:\/\/flostor.com\/case-studies\/qsc2.html<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\n

<\/div>\n\n\n\n

Comparison of Case Study Side Bars on Desktop<\/h3>\n\n\n\n

In the screen shot below notice how Dematic’s side bar has CTAs, (call to action from the user), and a clickable outline of the article’s different sections allowing the user to quickly get a gist of the scope of the article as well as allowing the user to jump around on the page by specific headers.<\/p>\n\n\n\n

Flostor currently is using the side bar to display a list of all the case studies available on the site. In my opinion, since the side bar content does not directly relate to the specific content of the page the user is on, this use of the side bar is distracting. I would suggest that we adopt Dematic’s approach to the use of our case study side bars. Note that the use of a side bar content outline is a industry standard. You everywhere on the internet. Again, this would require rebuilding all the case study pages.<\/p>\n\n\n\n

\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n
<\/div>\n\n\n\n

Rebuilding All the Case Study Pages?<\/h3>\n\n\n\n

The Flostor website is built with static HTML files. This means that in order to rebuild all the case studies pages is labor intensive.<\/p>\n\n\n\n

If you decide to green light the rebuilding of all the case study pages there is a more modern way of doing this which is far more efficient and that is to rebuild the site using PHP which allows me to use templates and includes which would facilitate the rebuilding process significantly.<\/p>\n\n\n\n

If we were to proceed with a rebuild using PHP I would suggest that we use WordPress which is built with PHP.<\/p>\n","protected":false},"excerpt":{"rendered":"

Case Study Comparison on Mobile Note how the text wraps around the images. On desktop wrapping text around images is […]<\/p>\n","protected":false},"author":2,"featured_media":135,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"footnotes":""},"categories":[6],"tags":[],"class_list":["post-111","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-comparisons"],"_links":{"self":[{"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=\/wp\/v2\/posts\/111","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=111"}],"version-history":[{"count":18,"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=\/wp\/v2\/posts\/111\/revisions"}],"predecessor-version":[{"id":277,"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=\/wp\/v2\/posts\/111\/revisions\/277"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=\/wp\/v2\/media\/135"}],"wp:attachment":[{"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=111"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=111"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/flostor-prototypes.leesonresearch.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=111"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}