Glasklart Weather

[MagnaMike]

A Glasklart-style weather app theme!

http://i1169.photobucket.com/albums/r513/TheMagnaMike/IMG_3575-1.png http://i1169.photobucket.com/albums/r513/TheMagnaMike/IMG_3581.png

I need help/input! As you can probably see, I have a small problem; I do not know how to change the font colour. I chose Sydney because they have daytime right now (its night time where I live right now), and the blue font stood out more then the purple (colour used at night).

---

Thoughts on keeping original style weather images, or should Glasklart style versions be created (taken from the weather icon project?).

---

DOWNLOAD: https://www.dropbox.com/s/hpow907ftoo3gv6/Glasklart%20Weather.zip

[jfelchner]

VERY VERY COOL! I think that if we go this route (which I think we should), the Glasklart style weather icons should definitely be used. Unfortunately the ones in the project need retraced with vectors which we could use here as well as other places where weather needs displayed (the live weather icon for example).

Would retracing the icons be something you'd be willing to do?

Additionally, the Yahoo logo and the "i" logo could probably use some Glasklart love. :)

[MagnaMike]

@jfelchner I'm new to all this editing stuff, I gave a go at creating a vector version of the moon found in the download from this post: https://github.com/glasklart/hd/issues/378 I'm not sure if I did what you're thinking though, can you check this out: https://www.dropbox.com/s/so7xq4u2h4yct65/Moon%20Vector%20Test.svg Keep in mind I do not have Photoshop so I cannot copy the Glasklart layer style :unamused: (someone else would have to do it). That is a good idea with the Glasklart style Yahoo and "i" buttons, but again, unfortunately I cannot do it. I really should get my hands on Photoshop, is there any free way to get any version of Photoshop that's not a trial?

[MagnaMike]

Oh yea, here's the buttons if anyone wants to make them Glasklart style.

[jfelchner]

@MagnaMike I'll look at that SVG, but as far as I know, The Gimp is the closest free thing out there.

[MagnaMike]

Thoughts? Day: http://i1169.photobucket.com/albums/r513/TheMagnaMike/3722D71F-7528-451C-AD62-E161EA8EBA33-409-0000000A15D2A1FA_zps73d14575.jpg Night: http://i1169.photobucket.com/albums/r513/TheMagnaMike/CA29FC0A-FE45-4435-BBDD-27557D1DBC9C-409-0000000A20F4A605_zps2c5b9f88.jpg

I don't think changing the font colour is easy, it must be something buried in the file called "Weather" under "/var/stash/Applications/Weather.app". Plus, I think I like having the blue/purple instead of just the grey for both day and night.

[jfelchner]

@MagnaMike your vector moon looks great!

All of the weather icons we'd need are here I believe.

If you'd like to give them a crack, I'd appreciate it. Also, I'm sure that once you've done the hard work of just getting all of the vector shapes done, that @dreamnet would be happy work with the layers to give them a Glasklart treatment when he gets a bit of time.

Also, as far as your color treatments go, I have to say I liked the first one better. I think the moon vs the sun is good enough to denote night vs day? If we do anything with this, I think grayscale is best. 'round these Glaskart parts we don't take kindly to no colors. :) Don't worry about the font colors. I'm fairly certain we can tweak those in a plist file somewhere.

Thanks again!

[MagnaMike]

@jfelchner Sweet! I'm new to all of this, learning as I go. :smile: I'll work on getting those other weather icons into vectors tomorrow if I get a chance, if not, sometime soon.

I agree with you 100% on the grey scale vs. colour, but if we can't get the font colour is changed, then I think the coloured versions might look better (would have to see once its all said and done).

[MagnaMike]

@jfelchner I think I did this right. see one of my later posts for updated SVGs Each individual "component" of the icon is in a separate layer. I had to made a new snowflake (just went with a very simple design, can be changed if you like) because the original one was too small to tell what was going on.

[dreamnet]

Here is the glasklartified Yahoo! button: Need some time for the info button...

[dreamnet]

...and the info button:

[sinfool]

Hey guys. I was a contributor to Glasklart back at macthemes. I made hundreds of ipad3 and iphone4/4s icons and also an SBSettings theme that I have yet to zip up and give to you guys.

I also attempted a very basic porting effort of a Glasklart weather theme some time ago (I used the GK weathericon icons). It themes all the weather icons system wide including the weather app w/forecasts, notification center widget and Siri weather. Have you guys looked at it for reference to make a better quality, more official Glasklart weather theme?

Let me know and I will post it ASAP.

[MagnaMike]

@sinfool With your port, did you just take the source icons and scale them up, sacrificing quality, or did you create higher resolution icons?

Edit: Also, the plan here is to use the SVGs that I created, someone with Photoshop to apply Glasklart style to them, and then they can be scaled to whatever size for each location weather icons will be displayed (notification center, weather app, live icon, etc.) without loss of quality.

[sinfool]

@MagnaMike No, I didn't create high resolution icon versions. That is what I meant by someone creating a better quality version. I basically found all the system wide weather related icons, weather app, notification center, siri etc, then resized some, made a few new weather condition icons and just put them all together. There are more weather conditions that would need to be created than just the weathericon ones you linked above. For example I made some wave looking ones for haze, fog etc. There's many different file names to account for which is why I thought my crude version would help. ;)

Here are a few screenshots:

Any way let me know and I will zip it up for you to look at. :)

[jfelchner]

Much appreciated @sinfool. Please give us a link to the zip and we can create vector versions of all of the ones we're missing.

Thanks again!

[MagnaMike]

Whoops! I upload the wrong SVGs...the other ones aren't wrong, they would still work, but these are better. https://www.dropbox.com/s/v3uzbzd0au5wyqy/Glasklart%20Weather%20SVGs.zip

---

@sinfool Yea, I know about the extra weather conditions and would like to see what you have, it would help. Also, I can compare it with this (this link was posted a while back in another issue): http://www.mediafire.com/?hvec0rpbmkr59f3 Then I can pick the best one for each weather condition whether its one of yours or the other.

[sinfool]

@jfelchner My pc crashed and I lost most of my media so just I pulled these off my phone and zipped em up. I hope they give you guys a head start. ;)

http://www.mediafire.com/?ela9p7bbzebaolq

On a side note...I still have the (500) plus icons and the SBSettings theme I made for my iPad3 and iP4/4S to sort through and upload. I will try to update all my apps (must have over 200 updates pending) to be sure that the icon names/bundle ID's are all up to date before I post them.

EDIT: ----------------------------------------------------------------------------------------------------------------------------------------------------------

@MagnaMike Oh ok...Yeah then maybe you have everything I did already because that link you posted above is mine. :)

Nevermind then. Since I made the Weather version of Glasklart you're referring to, there wouldn't be anything different in the version I posted right now or my earlier version you already linked to (except for some slight repositioning). LOL

[MagnaMike]

@sinfool Unfortunately, the .png's are unable to be viewed (I get a red x instead of the image). Do you use 'optimize themes' on winterboard? This would cause the icons to not be able to be viewed on a computer. :(

[sinfool]

@MagnaMike Yupp, I used the optimize feature a while back thinking it didn't matter if the images got compressed/changed from standard .png. This was before my pc recently crashed and I lost the originals. All I have left is what was on my phone. Let me dig around and see if I saved them on another HD. I made this theme a long time ago so there is a good chance I made a back-up somewhere. I will post back.

...I think their is a way to view then again but I forget if/how its possible. In the past, I noticed that if you transfer the theme to your phone, then transfer it back to your pc via USB (i.e. iFunbox etc) the images become viewable but they're a different gray color than what they normally look like..

[MagnaMike]

@sinfool Yea I can try that. If that doesn't work, I just had an idea, maybe I could transfer the optimized images (what you uploaded) onto my iPod, view them in iFile, then screenshot them and then use the screenshots to make vectors.

[MagnaMike]

@dreamnet Oh yea, thanks for the glasklart treatment on the buttons! Maybe if you get a chance soon, can you work your magic on the SVGs that I put up?

OK, here's all the weather icons that are needed (as far as I know), they need to have glasklart style applied to them. The components are split into different layers for ease of editing/to get the look right (with the partial transparency), if that makes sense. Just a side note, they are named correctly, they are just what I want to work with right now.

To do: I need someone to apply Glasklart style to SVGs: removed, see later post

Thanks!

[sinfool]

@MagnaMike I found another copy of the theme if you still need it. My version may have some of the icons repositioned better than my original link you posted above in your "Whoops post" but only a few if any. Let me know if you still want it.

But yeah, I made all those icons in the SVG zip you posted above. Well actually, I mean I made the icons, i.e. the fog, haze, wind, ice etc. by google searching icons that seemed to "fit" my idea of what would fit with Glasklart and then just resized/repositioned & tinkered with the stock original Glasklart weathericons made by Max to then create my own versions.

I've never used SVG's before but I like how it seems you improved on & tweaked my images to look sharper. I like your improved snowflakes, ice etc. I remember when I made this.... I was so tired of making new weather conditions by mixing/matching icons, cross referencing icon file names etc etc, that by the time I got to the snow and ice I was like, "Screw it! This snow will have to do". LOL

Just an FYI though...Not all of these icons are the "exact" pixel size of the original png files they're replacing but they were very close. After a few hours, I was too lazy to be perfect so you may want to copy all the stock original files off your device to compare the sizes (note some are in the shared@2x.artwork file). I'm not sure how SVG's work but I made all these icons with photoshop (the only reason I even started using photoshop was just so I could make Glasklart icons). :)

Also, I don't know how well the resizing method is going to work though ....because I'm not positive but I remember that quite a few of these icons (i.e. in the weather app at the top) I made were not centered perfectly on purpose to look right since the stock weather images (i.e. wind) are many different sizes and are meant to cover a much larger area than the single icon method the Glasklart style uses. IDKW, but basically, when I centered some perfectly they didn't look right when rendered on the device...(like the wind would be off to the left or right instead of centered over the moon/sun) ...if that makes any sense.

BTW, I can't be sure that every icon will be the correct weather condition either since I was never able to test ALL the weather conditions. I tried my best to match the file names with what the original stock weather condition images looked like, then made my Glasklart equivalents.

Sorry for the long post but I wanted to give you as much info I could think of. Thank you for trying to expand and improve on my original crude Glasklart Weather theme version!

[MagnaMike]

It's been a busy last few days and I have a busy week ahead of me....

@sinfool I think I'm fine, I don't really need your theme at this point. I'll sure will be checking the filenames/sizes/etc. once the theme starts to be put together, and will do lots of testing to make sure everything looks good. Thanks for the heads up!

What I really need is someone to Glasklartify the SVGs! Help! :+1:

[MagnaMike]

:cry: Unless I am mistaken (correct me if i'm wrong), all that someone needs to do is open up the SVGs and use the Glasklart layer styles on the layers in the SVG, I don't know, but I don't think it takes long at all... I would appreciate it a lot (!) if someone could do this. Once that is done I will be able to size all the images and get the right file names etc. and get the theme up and running, but until the SVGs are glasklart style, nothing can happen. Please help! :smile:

[jfelchner]

Can anyone beg borrow or steal Photoshop/Illustrator to get this done? @MagnaMike has gone as far as he can alone.

(For full disclosure I was kidding about the "stealing" part) :wink:

/cc @scottbuckley @jimmyt650 @richmFTW @iPhoneAddict @slipko @dreamnet @vinstic @echominor @Tr1pTr0p

[slipko]

@MagnaMike If you can get a trial version of photoshop, there is a script you can use to block the activation window to pop up (if you wanted to use that for the cough sole cough purpose of applying the style). I know there is one for CS5, i am not sure about CS6.

I am not familiar with SVG's. Can photoshop open them? If so, I could just apply the style, and you wouldn't have to do any of that.

EDIT: I am trying to download a plugin that allows photoshop to open these scalable vector graphics. Hopefully it will be a success.

[jfelchner]

@slipko @MagnaMike If you all want to have this... interesting... conversation, please do it via a Twitter DM or email.

But after the holidays, I'm sure someone I cc'ed will do this for you.

On Sunday, December 23, 2012, slipko wrote:

@MagnaMike https://github.com/MagnaMike If you can get a trial version of photoshop, there is a script you can use to block the activation window to pop up (if you wanted to use that for the cough sole cough purpose of applying the style). I know there is one for CS5, i am not sure about CS6.

I am not familiar with SVG's. Can photoshop open them? If so, I could just apply the style, and you wouldn't have to do any of that.

— Reply to this email directly or view it on GitHubhttps://github.com/glasklart/hd/issues/552#issuecomment-11647118.

[jfelchner]

And @slipko, yes you can apply styles to an SVG layer. When Photoshop opens it, it's just a standard vector layer.

On Sunday, December 23, 2012, slipko wrote:

@MagnaMike https://github.com/MagnaMike If you can get a trial version of photoshop, there is a script you can use to block the activation window to pop up (if you wanted to use that for the cough sole cough purpose of applying the style). I know there is one for CS5, i am not sure about CS6.

I am not familiar with SVG's. Can photoshop open them? If so, I could just apply the style, and you wouldn't have to do any of that.

— Reply to this email directly or view it on GitHubhttps://github.com/glasklart/hd/issues/552#issuecomment-11647118.

[MagnaMike]

Well, I may give that a go but I dont know yet. Well I'm not familiar with photoshop :p A quick google search told me that SVGs are better in Illustrator than Photoshop. Not sure. Anyway if SVGs are not working with Illistrator/Photoshop, I can size the images for all the sizes we need before they have glasklart style and save them as PNGs. Was hoping glasklart style could be applied to the SVGs because it would be less work for whoever copies the layer style (less files) and then they would be ready to go if in the future we needed another size.

On Sunday, December 23, 2012, slipko wrote:

@MagnaMike https://github.com/MagnaMike If you can get a trial version of photoshop, there is a script you can use to block the activation window to pop up (if you wanted to use that for the cough sole cough purpose of applying the style). I know there is one for CS5, i am not sure about CS6.

I am not familiar with SVG's. Can photoshop open them? If so, I could just apply the style, and you wouldn't have to do any of that.

— Reply to this email directly or view it on GitHubhttps://github.com/glasklart/hd/issues/552#issuecomment-11647118.

[slipko]

@MagnaMike I'll try this plugin, as I can understand why you want the vectors styled. I'll get back to you in a bit with (hopefully) results.

[slipko]

@MagnaMike I can apply the styles to the layers of the SVG's, but i cannot save them as an SVG. Also, they seems scaled very small, so I don't want to just save as a png....

[MagnaMike]

Darn. Yea, they are small because I just made the SVGs off of the old weather icons. So, the next best course of action would be to make large SVGs (512x512?) and then copy the layer style to those. Then save those as png's and use those to make the icons for each situation by scaling them down to the desired size? Or would that be bad for quality? On Dec 31, 2012 2:08 PM, "slipko" notifications@github.com wrote:

@MagnaMike https://github.com/MagnaMike I can apply the styles to the layers of the SVG's, but i cannot save them as an SVG. Also, they seems scaled very small, so I don't want to just save as a png....

— Reply to this email directly or view it on GitHubhttps://github.com/glasklart/hd/issues/552#issuecomment-11782374.

[jfelchner]

We need to make the SVGs bigger first. They should just be able to be scaled up (since they're vectors). Once they're scaled up, they'll need to be tweaked to look correct. Save them as the source image. At that point they should be able to be scaled up/down as we need them.

[MagnaMike]

Should I just scale the svg's to all the sizes we need them for each situation and just save them as png's? Then @slipko can apply the layer style to them if he's willing? On Dec 31, 2012 4:56 PM, "Jeff Felchner" notifications@github.com wrote:

We need to make the SVGs bigger first. They should just be able to be scaled up (since they're vectors). Once they're scaled up, they'll need to be tweaked to look correct. Save them as the source image. At that point they should be able to be scaled up/down as we need them.

— Reply to this email directly or view it on GitHubhttps://github.com/glasklart/hd/issues/552#issuecomment-11784816.

[jfelchner]

I'd be ok with that, but I still want one master SVG to keep in case we need a different size in the future. The SVG should be sufficiently big so that we don't need to mess around with it once you're done with it.

[MagnaMike]

Oh absolutely, what size were you thinking? I will take a look at the sizes we need soon, and I will probably need help with iPhone specific sizes for Siri. On Dec 31, 2012 7:38 PM, "Jeff Felchner" notifications@github.com wrote:

I'd be ok with that, but I still want one master SVG to keep in case we need a different size in the future. The SVG should be sufficiently big so that we don't need to mess around with it once you're done with it.

— Reply to this email directly or view it on GitHubhttps://github.com/glasklart/hd/issues/552#issuecomment-11786278.

[slipko]

The easiest thing to do (possibly) would be to upload the master/largest size as an SVG. I can apply the styles, save as a png, and then downscale from the "master png". It will not lose quality when downsizing. But if you png the unsettled images, I would only be able to apply the style on the whole image, not the individual parts.

On Dec 31, 2012, at 6:38 PM, Jeff Felchner notifications@github.com wrote:

I'd be ok with that, but I still want one master SVG to keep in case we need a different size in the future. The SVG should be sufficiently big so that we don't need to mess around with it once you're done with it.

— Reply to this email directly or view it on GitHub.

[MagnaMike]

Ok I'll reside the svg's and I may tweak a few of the icons tomorrow, now that I know this is moving ahead, I remember some of them were not quite what I wanted.

Overlooked that about png before layer style, that would turn out bad... On Dec 31, 2012 11:13 PM, "slipko" notifications@github.com wrote:

The easiest thing to do (possibly) would be to upload the master/largest size as an SVG. I can apply the styles, save as a png, and then downscale from the "master png". It will not lose quality when downsizing. But if you png the unsettled images, I would only be able to apply the style on the whole image, not the individual parts.

On Dec 31, 2012, at 6:38 PM, Jeff Felchner notifications@github.com wrote:

I'd be ok with that, but I still want one master SVG to keep in case we need a different size in the future. The SVG should be sufficiently big so that we don't need to mess around with it once you're done with it.

— Reply to this email directly or view it on GitHub.

— Reply to this email directly or view it on GitHubhttps://github.com/glasklart/hd/issues/552#issuecomment-11787367.

[MagnaMike]

Large SVG's: https://www.dropbox.com/s/5n7xqpeill2fh8w/Glasklart%20Weather%20SVGs%20LARGE.zip

It's been a while... I already had done most of the tweaking when I originally uploaded the SVG's, so I didn't have any to do now, just scaled them up. However, I'm not completely happy with the fog icon.

[sinfool]

@MagnaMike Yeah these look way better. I think the fog looks fine. That is what the original image I used looked like. The only thing I would suggest to tweak is the rain drops (from all the weather conditions) and the thunder bolt from the thunderstorm condition to form a point at the ends.

Looking good. :)

[jfelchner]

@MagnaMike I agree with @sinfool on all points. Great job! Just those few tweaks he mentioned and I think we'll be ready for the next step.

[MagnaMike]

@sinfool I'm confused, the rain drops are pointed? Is this what you guys are seeing because this is how I made them: If this is how you saw them, then I don't know what you want me to do. If it isn't how you are seeing them then I don't know what happened... :confused:

[MagnaMike]

Ok, tweaked the thunderstorm SVG, the lightning now have the pointed ends and they are no longer on the top layer, so it will look like the lightning is coming from the clouds (like it should) and not hovering on top of the clouds.

Link removed, look below for updated link

[MagnaMike]

Ohhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh.............. I see what you mean now with the rain drops... When I uploaded it to dropbox and clicked on it, I think I saw what you guys were seeing. Does this look familiar?

I will fix that this afternoon, I know the problem.

[MagnaMike]

Figured it out. Rain drops should be fixed for all conditions. Download includes all weather conditions including the pointed lightning. Basically, use these, forget the old ones! :smile: https://www.dropbox.com/s/ox21dqf5stiz8jc/Glasklart%20Weather%20SVGs%20Large%20V2.zip

Tell me if it still isn't good.

[dreamnet]

@MagnaMike : Here are some resources for you: http://glasklarthd.dreamnet.at/ajaxplorer/ Look in the folder iPhone4/Library/Themes/Glasklart Weather.theme/Bundles/com.apple.weather/source I have no problem adding the glasklart style to an image you provide, but you have to provide the images as png's with transparent background and in the size you nedd it - downsizing big pngs withe the glasklart style applied dosent look good.

[MagnaMike]

@dreamnet https://www.dropbox.com/s/pdlpr6sycxu1gh9/partlycombocloud%402x.svg I really need this in glasklart style. I know its not in .png but I don't know what you did to make the outlined seperation look between clouds (or other items). Also, its a new image not a smaller/larger version of one already made so I can't use any of the source images. There shouldn't be any new images so moving forward, if I need anything it will be in png like you want.

Thanks very much for those resources, I appreciate it. They look really good. :smiley:

Yea, I didn't think downsizing was the best.

I was able to theme nearly everything, only two things remain; the image I requested, and the current weather condition images for notification centre (the long rang notification centre forecast just uses the mini versions), and I believe the mini versions are what Siri uses as well. So the theme is getting very close to completion.

I don't have enough time today to figure out and upload .pngs for the un-themed notification centre images, so hopefully tomorrow I can do that. If you want to check it out here is what is done so far :smile:: https://www.dropbox.com/s/v5v93ry7xnb0bew/Glasklart%20Weather%20v5.zip

[jfelchner]

@MagnaMike can you attach screenshots for us to look at? :grinning:

[MagnaMike]

@jfelchner Oh, that probably would have been a good idea. Haha Here's an album: http://s1169.beta.photobucket.com/user/TheMagnaMike/library/Glasklart%20Weather

They're out of order...but oh well. :smile:

[sinfool]

@MagnaMike Oh OK. I misunsderstood how you were going to apply the Glasklart layer style to your version of my original theme. With your version, since the GK layer was only applied to the top layer, this has a different look than my original version. I'm still on the fence as I kind of like the slight transparent overlap look of my original version. I think I'm just so used to mine...but I really like the improved quality of all the icons in your version.

This looks great though. :) Nice job!

[MagnaMike]

@sinfool I was basing the theme off of your old one, but then this is what @dreamnet came up with, and I like it. It's how a glasklart icon would be made/look. Fits into the glasklart theme as a whole better I think.

@jfelchner I was wondering about removing the "y!" buttons from the notification centre widget(s), (just by putting in a blank/transparent image...the 'button' would still work, you just wouldn't see it). I'm talking mainly about the weather one, because the icons get really close sometimes cut off. Personally I never use the buttons and it would probably look cleaner without them. Also, I've been looking at the notification centre now with the glasklart weather, and the stock widget needs some glasklart love don't you think? so it matches I just like having the stock widget because it looks nice with it scrolling... and it would look nicer with glasklart :grinning: @dreamnet can you add the glasklart style? :smiley: