Color Profiles Explained | Sketch Tutorial (2020)
HTML-код
- Опубликовано: 2 окт 2024
- ▶︎▶︎ www.udemy.com/... - Today we're talking about Color Profiles in Sketch (48 or later) and comparing the differences between:
• Unmanaged
• sRGB
• and Display P3
When creating new documents, Sketch yields to your settings in the Sketch Preferences - on the general tab.
Here you can choose your default color profile when creating new documents.
Unmanaged documents don’t apply a specific profile to make sure colors looks right between Sketch and where your exported assets end up. Unmanaged just lets your operating system and display take over.
So If you’re on a newer Mac with a P3 display, you’ll see P3 color. If you’re on an sRGB display, then you’ll see sRGB colors. Unmanaged documents are the most performant but also the most uncertain when it’s time to export.
sRGB is the standard for web design. This is the way to go if you’re designing for a wide variety of devices, but the colors won’t be quite as vibrant as Display P3
So what is Display P3?
It’s the color profile of newer wide color gamut displays like some of the latest iMacs, MacBook Pros, iPhones and iPads. P3 supports a broader palette of colors but only on displays that support P3.
-
Download my entirely free Sketch resources at:
www.LearnSketch...
-
Launch Sale! Take my complete Sketch course on Udemy for 75% off:
▶︎▶︎ www.udemy.com/...
-
I Know your schedules are very tight, but men i look forward to seeing more of your videos. THANKS
I knew all of this already, but I'm still amazed at how well it was so easily presented and explained. I was trying to tell someone else about what a hex code was and this is the best I have ever seen it simply described.
Very well explained. Thanks!
This was a great explanation!! Will be linking to this video whenever I have to explain these color options from now on.
Hex is not for 6 digits, it’s a short for Hexadecimal which is the number system used to represent each of the digits in base 16 as you illustrated, beautiful video BTW.
What if we print out p3 display as CMYK is even more limited than sRGB? Will it still work? Or it’s not recommended to do so? If it’s not recommended, then do we need to keep sRGB as the standard when we start out an idle project? Because sometimes I just do an art without considering what will I do with it later, either just for wallpaper or printed out in the future. BIG BIG THANKS for anyone who can answer this!!!!
I have the same question
You can work in whichever colour space you’d like, but if you’re converting to a space with a smaller gamut, clipping will occur. This means that colours outside the destination colour space get made less vibrant. If you’re working on an image for print and screen, you’re best starting with the wider gamut image so you have the best possible and most vibrant version of the image, then do what you can to get the best results from the print version.
I feel like I just learned something from cheating on a test! Thank you for a great short in-depth answer. PERFECT 👌🏾
Nicely explained! This was very helpful! Thanks!
Awesome video, Keep up the great work! Can you make a video about the process of designing a website logo? I mean how to choose the color pallet to use and the type of the logo...etc.
BTW I think it will be good if you use playlists to organize the content of your channel.
thankyou for this great video, I had an aha moment when I discovered where the hex is applied in hex code. I knew it had something to do with 6, I just didn't know what.
Great explanation Joseph!
A web image that i exported out of sketch always looked a lot more desaturated than it did inside the program and i think this video explains why. However, what i don't understand is that when i take that image and export it with photoshop and then look at it in the browser, it actually looks fairly close to the original in sketch.
With the correct settings, both Photoshop and Sketch can match their canvas to the browser. With the wrong settings, both can look wrong. Also, the browser matters as well - CSS colours and images with no embedded ICC profile should assume they are in the sRGB colour space. Safari was the first browser to do this (version 6), and Chrome followed a few years ago. Very recently, Firefox adopted that behaviour.
Recap: For what you see on canvas to match the browser, use sRGB as your profile in Photoshop or Sketch, and use the latest versions of Safari, Chrome, and Firefox.
Yes I enjoyed. More please :)
On to Udemy..
Hello can you please answer my question. So if they're both 8 bit that means both of them have the same number of color possibilities right? So you're not really getting more colors with display P3 you're just getting a deeper range of colors? In turn that also means each single change to an RGB value will jump further from the one before when using display p3 so you can't be as precise with colors that are within both of the color spectrums? Can you confirm this to be true? Just thought of that from your video.
I would also think display p3 would be more subject to banding in when using gradients?
You’re right in assuming that there’s the same number of steps if the bit depth is the same, which does mean the steps are bigger and the precision is worse. That means you can have 8bit per channel sRGB images, or 16bit per channel (65,536 steps) sRGB images etc. You can have any combination of colour space and bit depth you like. It is common for wide gamut images to also use deeper colour. Many wide gamut displays use 10bit per channel for that reason - to ensure gradients are nice and smooth.
YOUR audio recording is NOT good. full of HISSS
aviad harush Hmmm I’m not hearing it on my end