Be nice. Or else.
Community Staff Founder at Bjango Joined about 4 years ago via an invitation from Christophe T. Marc has invited Matt Kelsh, Rene Ritchie, Dan V Peterson, Troy Mcilvena, Graham Clarke and 12 others, Jeremy Olson, Ramy M., Andrew Hart, Ricky Synnot, Aen Tan, Justin Velgos, Nik Fletcher, Rok Benedik, Nghia Nguyen, Jared Sinclair, Matt McDaniel, Elliot Jackson
Makes sense to me. :)
Hopefully I’ll be able to do a test on a Pixel and Pixel XL to confirm the numbers are correct (current numbers are based on screenshots and conversations with other designers).
You can’t use 411.4285714286 or 731.4285714286 for your artboard dimensions, so you have to round the values up or down. Use whichever you’d prefer, but 412×732 sounds easier to work with, because it’s perfectly divisible by 4.
Some more info, to build on Joshua’s reply.
The Pixel uses a density of 2.6×. The Pixel XL uses a density of 3.5×.
Those are both non-integer values. When the UI is rendered, the view sizes and positions get scaled to the display size and rounded (to snap to pixels). The assets get bitmap scaled down. This is actually fairly abnormal for Android devices, where most have integer densities.
When rendering the display on a Pixel XL, Android will use 4× assets and bitmap scale them down to 3.5× (87.5%). That means they’ll be blurrier.
The scaling method for iOS is a bit different (I can provide a comparison if you’d like).
Skala Preview (with the Sketch Preview plugin) sends the current artboard from your Sketch document at the size it was created. Skala View shows the exact image it was sent, using 1:1 pixel mapping (you can also zoom in Skala View, and zoom factors snap to integer values, unless you have fit to screen enabled).
Please note that the Sketch Preview plugin has some scaling settings that will affect results, too.
If you create a 1440×2560 artboard in Sketch, and the Sketch Preview plugin has its default scaling (1×), Skala Preview will send the 1440×2560 image to Skala View, and Skala View will display it at 1440×2560, filling the screen (assuming Skala View is at 100% zoom).
But, that won’t match a production app, if you’re creating your artwork at 3× or 4× scaling in Sketch. If you’re creating your artwork at 3×, then Android will display it larger (3× → 3.5×, or 116%). If you’re creating your artwork at 4×, then Android will display it smaller (4× → 3.5×, or 87.5%).
What’s the solution? That will depend on how you want to work.
If you want to work at 1×, where 1 pixel in Sketch = 1 Android dp, then use these settings:
Working at 1× means you can use the exact dp sizes noted in the Material Design docs. This is my preferred way of working.
Those should mean the preview is the correct size. Please note that it won’t perfectly match how Android will render things, but it will be very close.
Disclaimer: I haven’t done any tests on a Pixel or Pixel XL yet, but I believe all the information above to be true. If someone has corrections, feel free to let me know.
How did you measure it? Which browser are you using? Could just be a colour profile issue.
Yeah, lots of steady improvement there. The Wii was terrible. Wii U a bit better. This looks a lot better again. I’m very happy with that, given UI and menus are one of Nintendo’s weaknesses.
Do you want flattened vector output? If so, I’m not sure what does that. Illustrator has some very basic extruding and revolving that can product 2D vectors, but I typically use Cheetah 3D for illustrations that need realistic form and shading.
Here’s how I’ve been using it: https://bjango.com/articles/macappiconworkflow/
Yes. It’s a global macOS setting in System Preferences → General.
Turn this off, to do what you’re after:
Ah, okay. I didn’t know that. Thanks.
Yeah, might not be. I purposefully didn’t cover the ports and which displays are compatible, because I honestly don’t know. Even Thunderbolt 3 → DisplayPort can have issues, apparently. There’s a lot of complexity and confusion in getting high DPI displays working.