Working with visual content is the core of Conceptboard, that's why we provide multiple ways to add content to a board. You can drag and drop items, import from sources like Google Drive, and paste content from your Clipboard.
For all import methods, our main goal is to deliver a high quality visual representation on the board. The quality is a result of image conversion on our side and the scale that is used to display the converted content.
For example, if you uploaded a large picture from your camera to a board, without any image conversion or scaling, it would end up extremely large on the board. Especially, when comparing it with other items on the same board, like items you dragged in from the web or documents you've uploaded.
To make it easier to work in the board, we've added automatic content scaling to all board imports. The scaling does not alter the image quality or the file itself, but helps keep all items on your board the same relative size.
Manually Scaling Items
You can also select to scale an image to several preset sizes, or enter your own custom percent value.
You can choose:
- 1.0x (Actual Image Dimension)
- 1.5x (High Definition Quality)
- 2.0x (Retina ‘@2x’ Quality)
- 3.0x (Retina ‘@3x’ Quality)
- Scale with custom percent
Scaling by Custom Percent
You can select a single image or multiple images to scale. Make sure to only select images and not grouped items. Hold down shift while using the Select tool, or click and drag a selection around multiple images at the same time.
Alignment Options
When in the Select mode (Press S on your keyboard), click and drag a box around all the objects that you would like to align, or hold down the Shift key while selecting each item. Click on the ‘Object alignment’ icon in the floating toolbar and select the way you would like your objects to be positioned.
Alignment Left, Center, Right, Top, Middle, Bottom
When your selected objects are placed in a vertical row, click on the left, center, or right alignment option to arrange each items’ sides with each other. When your selected objects are placed in a horizontal row, click on the top, middle, and bottom alignment option to arrange each items’ sides with each other.
Distribute Horizontally and Vertically
Choose this alignment option when you would like to have an even amount of space between each object. When selecting one of these options, Conceptboard will use the first and last object in the row and give the appropriate amount of space in between them.
The Grid Layout
You can arrange items in a grid to make it easier to see them. Click on the ‘Grid Layout’ button and choose how many columns and rows you would like. Then click on ‘arrange objects’. You can choose to ‘Leave the top left grid cell empty.’
Note: Make sure to align objects as soon as they are uploaded to the board and group all items you want to keep together.
Retina Naming Convention
How does the automated scaling work? Files are scaled based on the following parameters. If your file names include the retina naming convention '@2x' or '@3x' they will be scaled accordingly.
Pixel Based Scaling
We've defined 3 rules for scaling. These only apply to the width of an image, so you can enter long screenshots without problems.
| Description | Scale | Attributes |
| Retina '@3x" | 3x | filename with '@3x' OR width ≥ 3,000px |
| Retina '@2x" | 2x | filename with '@2x' OR width between: 2,000-3,000px |
| High Definition | 1.5x | width between 1,500-2,000px |
| Original 1:1 Image | 1x | width < 1,500px |
Here are some more examples of data types and their default display size after scaling:
| Data Type | Image Width | Image Scaled | Default Display Size After Scaling |
| DinA4 | landscape, 1056px | 1x | 1056px |
| DinA4 | portrait, 816px | 1x | 816px |
| DinA3 | landscape, 1632px | 1.5x | 1088px |
| DinA3 | portrait, 1056px | 1x | 1056px |
| 5MP photo | landscape, 2592px | 2x | 1296px |
| 5MP photo | portrait, 1944px | 1.5x | 1296px |
| 8MP photo | landscape, 3456px | 3x | 1152px |
| 8MP photo | portrait, 2304px | 2x | 1152px |
| Biggest ImageRelay Size | 2400px | 2x | 1200px |
| Large ImageRelay | 1920px | 1.5x | 1280px |
| Small ImageRelay | 200px | 1x | 200px |
| Small website draft | 1280px | 1x | 1280px |
| Medium website draft | 1680px | 1.5x | 1120px |
| Large website draft | 1920px | 1.5x | 1280px |
| '@2x' iPad draft | 2048px | 2x | 1024px |
| '@2x' Macbook 13" | 2560px | 2x | 1280px |
| '@2x' Macbook 15" | 2880px | 2x | 1440px |
| 4k displaying screenshot | 3840px | 3x | 280px |
| 5k displaying screenshot | 5120px | 3x | 1706px |
Please keep in mind that you can always reset the automatically assigned scale, simply by selecting your images and choosing "1x" scale from the toolbar.