-
Posts
473 -
Joined
-
Last visited
Everything posted by All Media Lab
-
Hi, Yes you can! Zoom in > choose > crop tool > unconstrained > left mouse click draw from the corner left top > Enter > export image. Or what ever you want to do. Made a video to show you. But this way you loose the resounding part of the image (outside the crop) after save. Regards, David Capture 01.wmv
-
Your welcome! https://getbootstrap.com/ Here is a very old but good explanation of my work flow (HTML RAPID PROTOTYPING). Only I don't even use wire frames from an other source anymore and make it strait in to Bootstrap that works as a wire frame too. I do make a sketch on paper first. Some links are outdated, but the explanation is still relevant. https://blog.alexdevero.com/html-rapid-prototyping-facts-need-know/
-
Hi Aaron, Do all my prototyping directly in to Bootstrap 4 (HTML RAPID PROTOTYPING) and use Affinity Photo for images and Designer for logo's and vector stuff in the Bootstrap prototype. Saves a lot of hassle later on! CSS and JavaScript works instantly (and can be tweaked in a simple way!), responsiveness works out of the box. Can be used for applications and/or websites. That way you experience the creative and technical limitations and challenges of the design instantly in the prototype of Bootstrap. There are prototyping templates for Affinity (Bootstrap 4 for example!) Resources for Affinity here! Template Bootstrap 4 here! I find it complicating my work to design it first in a application (without testing if it works in the real world) and think it's better to show the client the real deal. If PHP or what ever is needed I show my clients the application or website on a local server (MAMP Pro) in my laptop that I carry with me. Of course you need basic knowledge of CSS, JavaScript and Bootstrap 4 or any other framework. (In the past I worked with Fireworks, Sketch, Photoshop and Illustrator and it has cost me twice as much time instead of working with Bootstrap and Affinity). This is only my personal experience/opinion, but maybe you have a good reason to make the prototype in Affinity. Regards, David
-
Hi, Just purchased "Topaz Gigapixel" as a Black Monday deal and got Topaz Studio containing "All Clear" , "All Remix" and "Topaz Adjust" within the deal. I wonder is it possible when opening Topaz Studio in Affinity Photo to save the corrections in Affinity Photo? All I can see now is when I open "Topaz Studio" in Affinity and use "All Clear" to make some corrections I'm able to save them outside Affinity. "Topaz Adjust" (the plugin that I also had before this purchase) can save the settings on a layer copy in Affinity Photo. Is there a trick to save corrections made in Topaz Studio in Affinity Photo? Warm Regards & Thanks, David
-
Hi Thomahawk, Never noticed that problem. I use both Photoshop and Affinity. To test it you have to provide the original image before any processing in Affinity or Photoshop. And explain what you want to do with it. I guess export at 65% or so in both applications? And like SrPx is suggesting give preferences info. Regards, David
-
Hi Tobias, I think that Canon Digital Photo 4 does a pretty decent job, the Affinity ones are not to bad. But the problem that I see is to much saturation that translates in blurry and not sharp details of the image. Of the Affinity ones I created I like the one with the TIFF link above the image most. There I had to go in minus with saturation to get a better image. Regards, David
-
Hi Tobias, Did not see your message earlier then this morning. Processed your raw in Capture One, Canon Digital Photo 4 and Affinity Photo (looked on a EIZO calibrated monitor), exported as JPG (somehow I'm not able to upload large file sizes to this forum). The results explain why I use Capture One! To test in Photomatix I need at least a 3 x bracketing for a good result. I love Affinity, but it's not there yet with RAW development. Regards, David Capture One Affinity Photo Second test Affinity Photo with more sharpening that doesn't translate in the export results I think this is an issue! It looks good and sharp in Affinity before develop, but after export it's not as sharp but the color definition is also not very good compare to Capture One :
-
Your welcome! For images (JPG PNG WEBP) on the web "resolution" is the actual size in pixels. If you have a 4 k monitor 4096px x 2304px is the amount of pixels that fill the screen. It's as simple as that. When you have a HD monitor 1920px x 1080px fills the screen. This is a app I created for full screen images (enlarge the browser or make it smaller (or look on your mobile phone) to see the effect). It's only HD quality, but you get the idea. Notice in Chrome it's loading webp and in Firefox jpg: http://full-screen.yourweblab.nl/ my code is open source and free to use, except for the images. For 4k I have to add a 4096px x 2304px image. Just try this free app, upload an image and you will understand when downloading the images and code what I mean, yes images in different sizes for different devices and art directions like portrait mode for mobile phones and tablets . https://www.responsivebreakpoints.com/ using picture and srcset makes the browser decide what image to load. You only have to provide the different sizes. The higher resolution screen the larger the image has to be, PPI or DPI doesn't work on screen. Only image size in pixels. Regards, David Example of breakpoints I generated for a background image I made this week (image is made by me and edited in Affinity Photo):
-
Hi, Yes instead of tables we use <section> and <div> now! The examples I posted are PNG's because that's what you posted for comparison (in a small size of 1000px X 685px like yours), for a pixel image they look OK not perfect but pixels are not vectors. When you are looking for crisp and sharp results in all sizes on all resolution screens in a website you can export as SVG (Scalable Vector Graphics) instead of pixels you use vectors that show no quality loss in different sizes. Disadvantage is that if the image is to complicated it uses a lot of code or doesn't look good. Do you prefer to use images (PNG JPG *WEBP) for the web, then you have to provide images for all screen sizes like in the examples of my previous posts. To use it for print you have to change the DPI settings according to what it is used for. (this doesn't work on screen and is of no use there!!!). In Affinity Designer the source is always Vector (as long as you don't use a pixel layer or persona). That way you can export in any size and *almost any file extension without quality loss only in that particular current size. As an example (when export in pixels) for a full screen image on a 4k screen you need an image of 4096px x 2304px and 5k 5120px x 2880px (iMac) to get a sharp and crisp result. If you normally use an small image size of a 1000px width for a image on a web page to view on a 1920px x 1080px screen (HD) you need at least more then 2x that size on a 4k sceen and almost 3x that size on a 5k screen to see it without artifacts. The SVG code for HTML of your drawing: <?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 1280 800" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;"><rect x="60" y="40" width="1070" height="730" style="fill:#fffffe;stroke:#000;stroke-width:4.66px;"/><path d="M370,110l230,520l-460,0l230,-520Z" style="fill:#ff2c07;stroke:#000;stroke-width:4.66px;"/><ellipse cx="500" cy="335" rx="340" ry="105" style="fill:#00bdff;stroke:#000;stroke-width:4.66px;"/><ellipse cx="645" cy="380" rx="245" ry="270" style="fill:#f0ff00;stroke:#000;stroke-width:4.66px;"/><path d="M140,110c462.81,252.485 879.748,510.365 720,550c-159.748,39.635 150,-340 150,-340" style="fill:none;stroke:#000;stroke-width:4.66px;"/></svg> Link to the SVG file: demo1.svg open in your browser (on the 4k screen) to see it and look in the source code of the web page to discover the code! Make the browser smaller or bigger to experience the scaling effect with no loss of quality. *Unfortunately webp is missing in the export possibilities. Regards, David
-
Hi, I hope webp is finally implemented soon in Affinity. We use is for every website and need other applications now to work with webp. Besides the fact that the most popular browser in the world is using webp (Chrome) more browsers are coming along with the implementation, so it's about time (I hope!). https://www.zdnet.com/article/firefox-and-edge-add-support-for-googles-webp-image-format/ The webp code is here to use for developing in Afinity: API for the WebP Codec The WebP team has provided an extensive API to allow developers to add support to their applications, including browsers, image editing tools as well as native applications. Consult the API documentation for a description of libwebp application programming interface. Regards & Thanks, David
- 2 replies
-
- microsoft edge
- chrome
-
(and 2 more)
Tagged with:
-
Yes and Microsoft Edge will be recognizing webp as well if this article is true: https://www.zdnet.com/article/firefox-and-edge-add-support-for-googles-webp-image-format/ But Chrome already does and it's the most used browser in Europe and the US. Reason enough to implement webp export and optimization in Affinity.