We have had success with deleting the 2X images and then editing the HTML so that it doesn’t reference the 2X files. Just change any reference from the name of the 2X file to the standard file and it works. I was having issues where once deleting the 2X files, they would not show up in the ad. Changing the names in the HTML fixed it, and now I can meet the 1MB limit. I am also using imageoptim before import, and I don’t see any change to quality.
If your images are the wrong size when you import them (larger) – you can run these steps to just use the 1x images:
When your document is complete:
- Export your document without changing and ‘automatically optimize’ settings.
- Delete all your @2x images in the ‘hyperesources’ folder
- Run your entire hype resources folder through imageoptim.
- Replace all your images with the 1x version of your images (Select image > Click Replace in Resources Library > Select the 1x versions which have been downsized)
- Select all your images and uncheck ‘automatically optimize…’ at the bottom of the resources library
Hi Daniel, in reference to this old post. I am not sure if I am understanding what is happening.
My images are blurry in the final export but ok in the preview. How do I get Hype to use the original png images and not the optimized reduced blurry ones?
It's ok I found the button to click as per Jonathan's reference above!
“Automatically optimize when exporting”
I'm good to go!
2 Likes
Feature request:
Please, just add a Preference or button disabling/enabling the export of the @2X version and we will be happy 
Many content creators don't mind to not create the Retina version because it is useful only in a few cases. They stay with @1x for various good reasons such as time saving, less bandwidth, final users not noticing the difference between @1X and @2x,…
Another good reason:
When we produce Google Ads, we don't need the @2X because it increases the size of the assets.
And because currently Hype always creates an @2X version, designers then waste time in preparing the images in Photoshop for each size of the add. Why? if we import an image that is too big, Hype will always create an @2x version, but not if the image is already at the right size and at 72 ppi.
If we could disable the creation of the @2X version, then designers imports just once the image and for each size adjust it, crop it,… When Hype exports the ads, it will optimize only the @1x version and put in the assets of each ad. Conclusion: saved a lot of time because we don't need to prepare all images.
See what I mean?
To clarify, you do not want to uncheck the 'Automatically optimize when exporting' option for the resource because you still want it to resize/compress the image, you just do not want it to export a retina version?
Makes sense to me (beyond the part where I personally can't stand seeing non-retina images!). I've filed an item to at least allow this to be an option exposed to export scripts.
(If one were ambitious about hacking at it, I'm guessing it could be accomplished in an export script that removes the "_2x" resources and probably hooks into the HypeResourceLoad call to change any _2x versions to their counterpart.)
No, it's not what I meant and I will rephrase it.
We like the fact that Hype optimizes an image thanks to the option at the bottom the Resources panel, but creating @2x versions is more a problem for online ads and for the other reasons I have listed.
Currently, if Optimisation is enabled, and if I import a 1000px wide image and resize it to 600px, Hype will always create a @1x version at 600px and a @2x version at 1.000 px. For ads, it's not good, we waste space in the 150 Kb limits at Google's for instance.
We like the optimisation feature, but we don't want the @2x versions.
This is why currently we waste a lot of time producing correctly sized and cropped images in Photoshop for each ad to avoid that your optimisation feature creates @2x.
So, Optimisation yes, but an option/Preference to disable @2x.
That's what @jonathan considered ... you can turn on optimization in Hype and have a script running that rejects the @x2-request on resourceload-event.
btw. an hypeoptimized image can be much more optimized using imageoptim or another tool ...
No guys, this is not what people want.
You know why Uber was a success and beat the traditional taxi companies?
It's the same with apps. One option in Hype to disable the generation of @2x and that's it, it will be much more efficient than doing post-processing each time we export. You have to make online ads to understand my point.
Well at a guess in part it is because they under pay and I am using the term loosely here, their
"employees" and were then able to undercut the competition.
You don't say..why ?
i see it's a feature request, ... but if necessary you could easily setup your own automized workflow to delete the @x2-files (automator) and add the scriptlines that delegate the filerequest to serve the @x1-file. not a great thing to do ...
1 Like
yeah the uber-strategy is nothing i'd support ...
1 Like
It's our natural inclination as helpful people to provide workarounds for feature requests until the features become features. Thanks for the detail here!
2 Likes
Traditional taxi:
- You need to call and sometimes to wait cause you're in a cue.
- “It will arrive between 5 and 10/15 minutes”. In fact you don't know why.
- You don't know how much will it cost.
- You need to pay cash.
Uber:
- There is a map where you see all the taxis' position in realtime.
- You know when it will arrive and when you'll reach your destination.
- You know the price in advance.
- You don't need cash, you just get out and it's paid.
It's a question if UX/UI guys. One click. We love the one-click solutions, not the “do it our way but then you need to apply post-process scripts etc”.
Designers don't want to do that. They want a solution that works under the click of a mouse.
– Developers are excited by the fact that they write code and a rectangle is magically drawn on the screen. Then they write some additional code to make the rectangle red.
– A designer selects the Rectangle tool and draws it. Want to make it red? Click on the red swatch.
If now, in Hype, designers need to run scripts written by developers to run a post-task process each time they send a proof or an update to the client, they will just not understand why there is no feature to meet their need.
Welll. I supposed this would do the replace bit in the export script.
Cannot remember if png's are sometimes converted to jpgs as x2 ?.
My tests worked though.. you probably have a more refined way of doing it..
insert_at_head_end = """
<script>
function resourceLoad(hypeDocument, element, event) {
if (event.url.includes('2x.')){
var name = event.url.replace('_2x.','.');
return name
}
}
if("HYPE_eventListeners" in window === false) window.HYPE_eventListeners = Array();
window.HYPE_eventListeners.push({"type":"HypeResourceLoad", "callback": resourceLoad});
</script>
"""
3 Likes
I'm a bit more confused now - these parse identically to me?
Based on what you've been saying, I'm a little curious if you have tried an Export Script? The entire point is to automate workflows that required a lot of steps to a single click. It adds new UI to make options for special use cases available.
I do not see any extra difficulty in choosing File > Export as HTML5 > Folder… versus the essentially same File > Export as HTML5 > AdWords….
It is true they need to be installed — but the Uber app needs to be installed on your iPhone first too :). We provide installers that even automate the installation process.
Regardless, I have no qualms about an option to have a non-retina export in Hype. However, it would not be exposed via normal UI (maybe in Advanced Export), as this is not appropriate for the vast majority of documents created with Hype. Balancing clean usable tools against a bevy of niche cases is difficult - Export Scripts were created to specifically add targeted functionality for those who need it and not show unnecessary UI for those who don't.
2 Likes
I'm not a developer.
My clients are not developers, they are designers.
We don't know how to write scripts.
But if the AdWords script includes an @2x version of the images used in the ad, then it's a mistake because of the 150 Kb limit. There should be no @2x version in the exported folder/zip.
Again, people creating ads with Hype understand my request.