-
ımg 1. Original | ımg 2. PS Edit | ımg 3. DMesh
Process of my image experimentation; will be adding more as I continue to use play around with various styles of editing and meshing.
-
Guess who just finished binding her first book? :D IT WAS SO MUCH FUN, I TELL YOU. I can’t even explain how anxious I was to get home so I could finish the final steps of this self-project. I thank Pinterest for sparking the interest in me by spreading that book-binding tutorial so I could pin it, and then feel like actually doing it. Anyway, I’ll definitely be carrying this around with me from now on. Nothing says DIY like binding a book yourself :3
-
Header for AngelicAilee designed and coded by yours truly in CS5.5 was released today! So here are my comments and notes about the process.
Created & Designed in: Adobe Photoshop CS5.5
Coded in: Adobe Photoshop CS5.5 & Adobe Dreamweaver CS5.5First Issue: The Navigation Bar
The navigation bar wasn’t much of a difficulty to code since the “Slices” and “Save for Web and Devices…” option in Photoshop that sends the file to Dreamweaver with basic coding helped. It was a pain in the bum when I was uploading it to the preview forum though. 2 sets of images were needed for 3 sections of the code: 1st section was for the normal image, 2nd section for what the image looks like when the mouse is on top, and finally the 3rd section for what it looks like when the mouse comes off. With 11 categories, it was just a matter of being organized so I don’t mess things up, put the wrong image in the wrong spot etc.Second Issue: The YouTube Video
No one told me that Flash and z-index hated eachother. Nobody. As you can see in the image, to create that layering effect on the top right corner, you need to use the z-index property. However, when you use Flash (the youtube video) as a layering element, it refuses to work. On my Mac, it looked fine on Google Chrome, Firefox, and Safari. Then I tried it on my PC. It refused to work on both Google Chrome and Firefox by ignoring the z-index and just staying on top of the “Ailee’s Latest Performance” cloud. I didn’t get why then, I still don’t get it now. Hours, days, of me just mulling over how to get over this problem. I also asked my design friends if they knew how to deal with this problem. They tried helping, and I thank them so much for it, but it remained a mystery.
When push came to shove, I had no choice but to alter the “Ailee’s Latest Performance” cloud lower so that even if it messes up, it’ll sorta look like it was part of the plan. Honestly, it wasn’t, and I’m disappointed that I wasn’t able to solve it. But, given this problem, it still came out okay. Ailee-ans loved the header, and I’m glad that they do. I expected the worst to be honest. Complaints about how it doesn’t show up properly, especially. In the end, it all worked out and I’m happy that everyone loves the new header :)
-
Original image is meant to be seen with the couple side by side, but I was afraid the file would be too big for tumblr so I split it in half. Not sure why I decided to illustrate this, but I felt a lot of people would benefit from it. It’s pretty much for the people who learn better when it’s visually right in front of them, instead of trying to imagine the connections in their heads. Not to mention, it’s a great reference to refer back to when dealing with dramas and learning korean and all that good stuff.
Okay, I’ll stop trying to rationalize my impulsive decision and shut up now. See ya!
Credits:
Illustrations made by lisyeung.tumblr.com
All information, family links and titles taken from oniontaker.tumblr.com
-
Now that the new layout has rolled out, I wanted to showcase the forum 2.0 and 3.0 graphics that I contributed. Thought they came out pretty well, and I’m happy with the result ^^!
Typeface: Harabara at 10pt
Cloud Brush: link
-
Typeface: Cambria
For: Soompi’s Official Ailee thread
-
Color of the Year 2012: Exhilaration
It’s an orange-ish yellow colour that’s full of life. It embodies the whole of what can be a very fruitful future, and gives people hope when the media around them tells them otherwise. 2012 is a year of very promising results, and I feel that with this colour as the Colour of the Year, we can come together and make this year our very best, if not the best.
-
Look what I made, tumblr :D You can learn to make it too, just click here!
-
Coded: for Blogger, but can also be used for other sites as well… I think.
Time taken: Approx. 3 days of on and off designing and coding.
Programs Used: Adobe Photoshop CS4 | Adobe Dreamweaver CS4
Credits: ColorLovers | Dezinerfolio | Blogskins | WeHeartIUDescription: IU’s Dream Waltz is a limited elastic-fluid hybrid kind of design. It was designed so that if you resize the browser window, the pattern is continuous: IU remains at the bottom-left/bottom-right, and the blog window is still the same size no matter how big the screen is.
_ The frame was created in Photoshop, then saved it for Web and imported it into Dreamweaver. After that, coding the frames, where everything was supposed to go, how it appeared(e.g. font colours, size, hover abilities, headers, links, etc.) just went along rather easily.
_ The menu on the left took the longest to code due to the fact that it wasn’t showing up properly in Dreamweaver and ended up having to code that somewhat separately so it worked how I wanted it to.
_ I had planned to leave placing the IU images to last mainly because they weren’t a /huge/ part of the design, though now that I look at it, they seem to help quite a bit xD Resized and cleaned up the images in Photoshop and coded them to be fixed into place no matter the size of the browser. Honestly, I had thoughts in my head whether I wanted to vector the images instead of using the actual images but due to the fact that it would distract from the main point of the blog (which would be the entries haha) I chose not to.
