• Multi-row 360 Product Views in WebRotate 360 SpotEditor

    Due to popular demand, let's review two ways you can publish multi-row 360 product views in WebRotate 360 SpotEditor.

    Multi-row in WebRotate 360 is a feature that let's you spin 360-degree images both vertically and horizontally. Although rare, some folks also use our multi-row support to create product configurators and tours, where you can instantly switch product options like colors within the same view.

    Using "multi-row" for configurators is problematic in that we load all images from all rows upfront, and so it can be quite slow if you need to cover lots of options (e.g. color, fabrics, etc.). For image based configurators, we usually recommend using "reload" feature that lets you load separate 360 spins or animations within the same view on demand. The feature is available via viewer API or using Hyperlink hotspot action with viewer config as action URL. More details on both the hyperlink action and APIs can be found in the user guide.

    Used for color configurators with 360 view feature

    We have a few blog posts dedicated to image production workflows for multi-row 360 product spins using both photographic setups as well as 3D image rendering in specialized 3D software (e.g., post1, post2, post3). You may also find a couple of live multi-row examples on our website (e.g., here and here). We also support a unique two-row rotation mode that you can learn more about in the following post. While technically a "multi-row", the two-row feature is not covered in this blog post.

    Each row in a multi-row 360 product view consists of the same number of images. The software will warn you if this requirement is not met or will automatically add dummy grey images to even out all rows. If you edit a published 360 view  manually (i.e via config xml) or generate it programmatically and end up with inconsistent number or images in rows, the viewer will fall back to treating it as a single-row 360-degree product animation.

    There are three ways to create multi-row spins like the following example in SpotEditor.

    Generic 360 multi-row example, 7 rows by 36 images.

    1. New Project Form

    Start by organizing your images in a single folder. They have to be named sequentially through the rows. For example, if you have 3 rows consisting of 24 images  each (72 images total), and the first image of the first row is named image0.jpg, then the last image of the last row is going to be image71.jpg.

    The following screenshot illustrates the folder contents with 3 x 24 rows:

    Create 360 Product Spin With Top Bottom Views

    Once images are prepared in a source folder, select New Project in SpotEditor, enter the name of the project, its location and the location of the source folder with the multi-row images on your hard-drive. Check Advanced options and enter the number of rows in the source folder via "Number of image rows".

    Download example 360-degree images with 7 x 36 images here and enter 7 under "Number of image rows" for a quick test.

    Select Create to load the images.

    Create 3D Multirow 360 Spin View New Project Form

    While it's possible to drag images left and right in the preview window in SpotEditor right away, to switch rows you need to either use the vertical arrow buttons in the top toolbar or flip the rows under Images -> Rows tab. The reason you can't drag images vertically in the Preview is due to how we load images in SpotEditor. To apply edits such as image crop or levels in real-time as you drag images, we have to keep the images ready in memory which can be quite taxing on your computer. It would be more likely to run out of RAM, if we were to load all image rows upfront.

    There are several important settings under Control -> Rotation related to 360 multi-row views in SpotEditor that you need to be aware of: 

    Multirow 360 Viewing Up Down Spin Features

    Speed -> X and Y sensitivity

    A smooth multi-row 360 product view should be easy to navigate both vertically and horizontally which is not always doable. As even a tiny vertical mouse movement can trigger transition to the next row while dragging 360-degree images horizontally. To control the ease of the transition between rows and frames in individual rows, use X and Y sensitivity options for horizontal and vertical drag respectively. They are basically pixel values that tell the viewer how much drag movement in pixels to ignore until it can flip a row (Y) or jump to the next frame (X).

    On view load -> Set current image (row) as first

    As you may already know, this setting sets the first image that the viewer will have to load and show right away and before loading the rest of the image sequence. For multi-row spins, this also sets a starting row user will interact with, which is a row that corresponds to the "first" image.

    Direction -> Flip vertical input

    Depending on the order of image rows, which mostly depends on how photography or rendering was setup, you may end up in a situation where dragging images down will move rows up and vice versa. This setting can quickly fix this by switching the direction of vertical row animation in response to user input.

    2. Images > Rows

    If you need more control, there's also Images -> Rows tab where you can add or remove rows and images individually. That can be useful if you create an empty project without specifying a source folder on the New Project form, or if you capture additional rows for an existing project that you need to append. Using options under Images -> Rows you can add rows or images either individually or in a batch. The panel options at the bottom of the tab also allow repositioning or replacing individual images in each row.

    Edit Multi Row 360 Product Animation Extra Rows

    To add a new row(s), click the green plus and enter the number of rows you are adding and optionally select a folder with prepared images (if you are adding multiple rows at once, prepare images in the folder as discussed in the beginning of the post). If a folder is not selected, a empty row is created and you can then import images into the row using the panel button with a small plus sign.

    If you end up with dummy grey thumbnails that are automatically added when the number of images in rows is not the same, select the thumbnails with your mouse (Ctrl key for multiple selection) and click the button with an arrow to pick matching replacements.

    3. WebRotate 360 Turntable Animator for Blender

    Blender is a popular 3D modeling and rendering software and we have just released an advanced plugin for it. With this plugin, you can:

    1) Setup a 3D scene for multi-row rendering in a few mouse clicks.
    2) Render all images using Blender's built-in rendering engines.
    3) Instantly view the result as an interactive view and/or upload it to PixRiot.
    4) Open it in WebRotate 360 SpotEditor for further editing and publishing.

    Find more details about WebRotate 360 Turntable Animator on our Blender plugin page.

  • PixRiot Adds Analytics for WebRotate 360 Product Views

    Our new analytics support in PixRiot can help you better understand how 360 product photos and 3d renders you host on PixRiot are being used on the web. In the initial release, available reports include the total number of unique views across all devices, the number of unique views on mobile devices, the number of views by web scanners (e.g search engines, etc), most viewed assets, as well as overall traffic and storage usage in PixRiot.

    By tracking the number of unique views, you can get a sense of the overall popularity of your products and how much interest these 360 product views are generating. This information can be useful for a variety of purposes, such as identifying which products are most popular, determining how well your marketing efforts are driving traffic to your website, and identifying opportunities to optimize your website and product offerings. Additionally, tracking the number of views by search bots and other internet scanners can help you understand how much PixRiot traffic is "wasted" by search engines or have an additional insight into your search engine optimization (SEO) efforts.

    To access the new feature, select Analytics on the left side of the PixRiot dashboard and pick any of the available reports from the drop-down at the top. Options to change time range and granularity of the reports are available at the top of the dashboard on the right-hand side:

    Pixriot Analytics For 3D Product ViewsDistribution of unique views between desktop, mobile & crawlers

    Additional reports will be introduced shortly and will include the tracking of user interactions with interactive assets such as WebRotate 360 Product Views, similar to what is available in our standalone Google Analytics integration, viewer load times and the ability to track where your asset views are coming from geographically.

    We are excited to offer this tool to our existing and new subscribers, and we hope it will help you gain valuable insights into the popularity of your 360 product views and the performance of your marketing efforts.

    Request PixRiot Account

  • Use WebRotate 360 Product Spins Offline on Android

    Photo by Sten Ritterfeld / @StensLens

    We just finished a quick review of available options to showcase webrotate 360 product views offline on Android devices, so this post is to share and track our current recommendation.

    You may have seen this older blog post about using WebRotate 360 on iOS. The key there was installing a third-party app called Kiosk Pro that would facilitate transferring your webrotate content to iOS as well as serving the content using their kiosk interface. Without such app, the only other option would be to develop a native app for iOS that would do pretty much the same (you would use a WKWebView control to present your uploaded webrotate 360 product views on iOS).

    It's a similar story with Android and so unless you have resources to develop a native Android app, finding a good existing option on Google Play is the first choice. And so we did..

    Of the Android apps we could find and review, the winner was AWebServer. It's fee with ads that only show in server setup and there's no paid ad-free version yet. While there're similar apps with no ads on Google Play, this one seems most simple, reliable, and well-thought-through. It runs as a service and with over 100k installations and good reviews, it's a solid choice.

    360 Product Spins On Android Offline 2
    How do you use it?
    • Create a new 360 product view project in WebRotate 360 publishing software (SpotEditor), configure and publish.
    • Upload your project's "published" folder to an Android device under some folder you designate for 360 product views. You can do it while online using Dropbox or Google Drive for example or via a memory card on your device.
    • Install the AWebServer app.
    • Start the app and select the folder you have created for 360s via Document Root option on the main setup screen.
    • Select Start under Service.

    That's it! Now your folder content is served locally (and remotely on your network if you are online) and you can access it in your Android web browser via localhost, i.e:

    http://localhost/your-published-folder/your-published-file.html

    You can then use this as a basis for developing a product catalog page or a cool offline presentation for a tradeshow or your on-site sales team like this great example by ACTiVATE.

    PS: while we haven't tried it yet, you may also consider Fully Kiosk Browser for a complete kiosk style experience.

  • D-26 Turntable for 360 Product Photography by VIVAT. Get 20% Off Until July 31

    We rarely review third-party 360 product photography hardware, mainly because WebRotate 360 solutions for 360 product photography so far have been hardware agnostic. Today though we feel obliged to introduce you to VIVAT's turntables. VIVAT is a small manufacturer located in Ukraine, an Eastern European country that now fights for survival. And while we support efforts there by other means, being able to help a company that works in the same space in this part of the world is important today.

    So without further ado, let's see what VIVAT has to offer, starting with their smaller D-26 table.

    To start with, the table was designed from grounds up and specifically for 360 product photography, unlike some gimmicks we see out there with rebranded display stands and alike. The team at VIVAT didn't start working on the product out of the blue either. They are professional photographers who shot plenty of 360 product photography before embarking on the product development. Not unlike truly yours.

    D-26 is rated for weights up to 44lbs (20kg), which is sufficient for most small object photography be it jewelry, small electronics, footwear and such. If you are a professional product photographer, that's enough to get started. Note that even though the base platform is just 26cm (10.2") in diameter, you can order an expansion platform and some are 60cm (23.6"), so you can deal with some bulky items too. AC input can be either 110v or 220v.

    Vivat D26 Photography Turntable Dimensions

    The table comes with a camera sync cable and you get a free adapter based on your camera model that you chose during checkout. 

    D-26 can be operated in 3 modes: photo, video and manual, where photo is an automated stop-motion 360 product photography, video is a non-stop 360 video shooting, and manual is where you can control everything using provided features. In terms of automation, it's pretty much an industry standard and is something we see in the top of the line tables by other manufacturers.

    There are a couple of things we really appreciate in the design of D-26:

    IR remote and on-board control

    360 Photography Turntable With Remote

    We have been shooting commercial 360 product photography non-stop for many years until 2016, and I can't tell you how many times we wanted to get a hand-held remote like this in our tables that were three times more expensive (we're taking 2009 prices).

    Why? For quality work, you can't just place a product on a turntable, click a button on your computer and wait for great results while specialized computer software works its magic, triggering camera and spinning the platform. Rarely happens. Things reflect differently as it spins, products shift and wobble, etc., so you have to really work your setup and that means running back and forth all the time between the table and wherever your computer is tethered. So if you can control everything via a remote or right there at the table using VIVAT's LED screen, that's a big plus. Granted you would still want to wire your camera to some large TV screen nearby so you can also review images as things progress.

    Tripod mount at the base

    360 Product Photography Upsidedown 4

    This is very handy and is something we would be quite happy with in our own studio as well. Having the table mounted at a level that doesn't require constant bending is priceless.

    But there's more. When advising our clients on shooting 360 product photography, we often have to warn them upfront that it's actually rare that you can simply throw a product on a table. There's all sorts of rigging that is often involved in keeping products upright and also it's not uncommon that you have to shoot products mounted upside down and the base tripod mount can really help with this (note that it's an extra option that you would need to select during checkout).

    See how we actually had to drill our turntable on one project to be able to hang it upside down, or see this recent guide on 360 product photography by Jose Soriano with a similar example.

    Portability

    D26 360 View Turntable Cables

    D-26's extra 12v power input gives you the ability to shoot pretty much anywhere by powering the table via a power bank and this means lots of flexibility. While you probably have an AC outlet in your studio and an extension cable as needed, sometimes you may need to travel to a client or even shoot outside, and the 12v input can be a game changer. We have been shooting on location on a few occasions (example) and finding an AC outlet was not always easy.

    Not to mention, D-26 comes with an over the shoulder carrying case which is a nice touch by VIVAT.

    Conclusion

    While we haven't used D-26 ourselves yet, at $349 it seems to be an excellent deal if not just for your on-site projects, if you already have something similar.

    VIVAT is running a 20% promotion on D-26 and D-70 which is live until July 31st. Use code webrotate-20 at checkout to apply the discount. Plus you get 20% off on WebRotate 360 Product Viewer, if you get both.

Subscribe to our newsletter

Sign up to our newsletter to keep a pulse on our latest developments, informative posts and beta releases. We don't abuse it!

Signup