2015/02/23

Words for the Week No.26 // About perspective

It's monday, but I don't have a Creative10 project to show you. I've been more creative than usual, but somehow, painting wasn't one of those creative activities last week. I've been making a lot of projects for my upcoming e-book, so I took some time off from the creative challenge.

Over the weekend, I read Oliver Sacks' thoughts on having terminal cancer. He's 81 years old and so, the prospect of death wasn't that foreign to him (being first diagnosed with cancer 9 years previously), but having a clear deadline to his life's work did change his perspective on both life and death. 

This article was somehow unbelievably inspiring for me. When you read the above quote, it might feel sad, not inspiring. But, if you turn the perspective around, and look at it not from the ending, but from the beginning point of life, there's a whole new story there. 

We are all born unique. And, I don't mean it in a motivational-speech kind of way, at least not directly. I just want you to think about this for a second. We all have a unique set of DNA code + a unique life journey which means that there isn't a single human being ever that is exactly the same (at least, the statistical probability of that is non-existent). Isn't that fascinating?

Yes, we all have similar experiences, but we are not the same. Our life is not like any other. We are not like any other. That somehow makes me proud of my life. I'm the only one who gets to experience it. Even more, I have the power to shape what this life is going to be like. I'm the active creator of a big and powerful artwork that is my life.

I loved reading Sacks' thoughts on his life and how he sees the last days of his life. I mean, I hope I live at least another 60 years, but no matter the length, we are born with an expiration date. Am I living my life in a way that by the time I'm at the finish line I would be thankful for every day and everything I was able to fit into it? Honestly, I'm not sure. I think I'm getting there. I think I'm trying to get there. But, I know I could be more bold. More courageous. More appreciative of this unique experience that is my life.

Make this the best week of the year yet! I know I plan to.

xo. Hanna

2015/02/21

DIY Blog Design // Tips and Resources for Blogger blogs

Last week, I shared 5 lessons I learned while DIYing my new blog design. Today, I tought I'd share my top tips and resources for creating your own blog design on Blogger. A lot of these are applicable on other platforms, too, but since I don't have any first-hand experience with them, I can't really give my word for it. I'm going to talk about the preparation of your elements, and the installment on the blog itself. Of course, everyone's design is different, and you might not find all the answers here, but I've rounded up some of the most used features.

Also, this is not a guide for creating a whole template from scratch, but ways to modify an existing Blogger Template. Most Bloggers will use the Simple template as the base, and I really recommend it. It's the closest you can get to a clean slate on Blogger. My custom template is also built on the Simple template. 
My top tips for creating your own template:

1. Map out the layout. After you've done your design homework on colors, fonts, and the feel of the new site, start mapping out the layout. Where do you want the header to be? The top is the most common place, but I've also seen a lot of cool designs with the header on top of the sidebar. Where do you want your menu bar (or navigation bar) to go? One sidebar or two? Which elements to put into the sidebar and so on. Once you're happy with your vision, make a list of all the elements you need to design. 
Relevant resources:


2. Size matters. Before designing your elements, you need to kno how wide your blog and columns need to be (mine are: total 1100px, sidebar 360px). One thing to know about blogger is that it has a lot of padding (space around elements) coded into the template, which you need to take into account when you create the custom images for your design elements (like header, sidebar dividers, etc.) This is something that really annoys me about Blogger templates, because you have to figure out how wide a sidebar really needs to be to fit a 300px wide element. My experience says you've got to add about 50 to 60px. So, my blog is 1100px wide, but my header is actually 1050px wide, and my sidebar images are all 300px. And, I now size all my images in the posts to be 650px wide. If you're thinking about offering sidebar ads, the most common size is 300px wide (by 250px), so that's also something to consider. 
Relevant resources:

3. Make templates for design elements. When you're working with Photoshop to create your design elements, save a .psd of each item with all the layers, so you can make modifications easily. You won't really get the big picture before you see the element in the whole design, so there might be times you want to change the font size, or color, or you need to make something smaller or bigger. This makes it so much easier. And, keep the psd-file current, meaning save tweaks. I have all my .psd files in a folder, so whenever I need to for example change my navigation bar, or add a sidebar divider, or change up the posts in the favorites category, I can do that easily.
Relevant resources:

4. Learn basic HTML and CSS. I know, you're probably rolling your eyes right now, and it seems super intimidating. But, think of it this way. When you're going to a foreign country, and you know no-one speaks English there, it makes sense to learn the basic phrases in their native language, right? It's the same thing with doing your own blog design. Unless you hire someone to actually install all the design elements, or get a friend to do it, you need to learn the basics of Internet language. All the things that you see in the internet are actually made up of code, called HTML, and a lot of the things are styled using CSS. Think of CSS (Cascading Styling Sheets) as the garnish on top of the HTML pie. First you need to bake the pie, and then you can add some garnish to style it if you'd like. 
Relevant resources:
5. Don't be intimidated to alter code. Once you and HTML know each other a little better, changing your template code won't seem like such a big deal anymore. However, always ALWAYS make back-up of your template before applying any changes, so that if anything goes wrong, you can easily fix it. When you add code, you can just delete what you just added and everything goes back to normal. 
Adding custom CSS is even easier. You can add all the CSS you need by going to Template -> Customize -> Advanced -> Add custom CSS.

6. Make a test blog. I briefly mentioned this in my previous post as well, but you really need to test all the code and the elements you want to create. And by testing, I mean creating a separate private blog and trying to install the whole template like you want it there. Since Blogger has it's own system of building code, it only makes sense to test your template on another Blogger blog. There is a problem however. So, the way Blogger works is that each sidebar element you create is a separate entity of HTML, and has it's own name in the blog template code (like HTML1, HTML2 and so on) based on the order you added them. The tricky thing is, you can't just download the template (from Template -> Back-up/Restore) and then up-load it to your real blog, since the widgets aka the sidebar elements are not embedded in that code. In the template code, those elements are only referenced with their name. So, when you would up-load the template to your blog which already has a bunch of widgets (like your archive, popular posts, follow buttons and so on) that are also named HTML1, HTML2 and so on, it would replace the element that was already named HTML1 on your blog with the HMTL1 from the test-blog. So, when the HTML1 on your original blog is not in the exact same spot as on your test blog, you're in trouble, because all your elements will be in random places. 

There are several options for addressing this issue. You could find out all the names of your blog widgets, and start adding them to the test blog in that order (so that if your archive is named HTML6, the archive would be the sixth element you add to your test-blog). Another way would be to manually overwrite the code in your widgets with the code in you test-blog widgets. This way, you wouldn't be up-loading a whole new template, but rather just updating the old template. This would also mean, you need to take note on which elements you added custom CSS and change those widget names according to the widget names on your original blog. You could also change the widget names manually in the code to correspond to the widget names from the original blog before you make the template switch. This should also eliminate the problem.

Most importantly, make a back-up of the old template before you make any changes.

Other resources:

7. Take a course, if you can. If you have the funds for it, take an e-course about designing your own blog. I made my first custom design following the Blog(Design)Love e-course from A beautiful Mess. I learned all the basic coding from there and a lot of the stuff was already coded for me, so I didn't really have to know a lot, just copy and paste. They now have a new version of this course out called Blog (Design) Love 2.0. I haven't taken it, but I bet it's also very good, or even better than the old version. 

I hope some of this will be helpful to some of you. If you have any questions or would like to know more about any other aspects of creating a custom blog design, let me know in the comments. 

xo. Hanna

2015/02/20

DIY Geometric Pendant Light Fixture

Happy Friday, friends! So, I know you're looking forward to some creative time this weekend, so I thought I'd share something to get your ideas flowing. This is a project I've had on my mind for a while. Well, ever since we moved into our Leverkusen home. We had no light fixture (or light for that matter) in the kitchen for the first couple of months. Then, we bought a simple light bulb on a wire from IKEA, and that's been it for the past 2 months. So, needless to say, it was time to finally finish this part of our kitchen. 

I know I say this a lot, but this is the best project ever. I mean, it just looks so cool, I didn't even expect it to look so good, but it does. And I love it! Apparently, I'm really into geometry these days, as my hubby pointed out. I've been browsing geometric pendant lights on Pinterest, and ran into a couple of Himmeli wreath projects that gave me the idea to use the straw technique for this project. It worked like a charm (well, after some tweaking). 
 This is what you need:
  • Cocktail straws (mine were wide, and 13cm long)
  • Crafting wire
  • Wire cutter (or you could use your scissors for the wire cutting, if possible)
  • Scissors
  • Thick felt
  • Glue (for mounting the fixture)
First, prep your materials. You'll need 18 long straws, 12 half straws, and 12 quarter straws. Be as precise as possible with the cutting, as it does affect the end result a little. My first fixture kept getting a little tilted, so I made another one, and made sure to cut the straws all exactly the same length, and I think it helped, cause the second one is much straighter. It does still need some bending and straightening once it's done, but we'll get to that part.
The process is way harder to put into words, than it actually is to do, but I've tried to make it as clear as possible. So, in the pictures you see a lot of colors. In every photo, the straws added in that step are black, and each preceding step has it's own color, so you can get a better idea where you are at. Later, I only highlight the parts that are relevant to the step at hand. But, note that the color for that particular set of straws is always the same for easy reference once we get to the second story.

Cut a long piece of wire. I found that 3m was an ok length to work with, longer than that, and it starts to get tangled. Whenever you run out of wire, just wrap it around the corner you end at a couple of times and leave a tail. Then cut another piece of wire and attach it to the corner where you have to continue adding straws. When you're done, just tuck the wire endings to a nearby straw to hide them.

1. Add 3 long and 1 half straw onto the wire and connect them into a rectangle. 
2. Add 1 half and 2 long straws, and connect up to the orange rectangle.
3. Add 1long, 1 half, 1 long straw and connect to the next corner of the orange element. 
4. Add 2 long, 1 half straw and connect down to the next corner of the orange element.
5. Feed the wire back through the short straw of the last added element (blue).
6. Add 1 half, 2 long straws and connect up to the next corner of the previous (blue) element. Then, add 1 long, 1 half, 1 long straw (yellow) and connect to down to the next corner of the element just added (red).
 7. Almost done with the first round. Add 2 long and 1 half straw, and connect down to the corner of the red element.
8. Feed the wire back through the half straw of the last added element (purple). Add 1 half straw and connect to the green element, forming a hexagon.
9. Feed the wire up through the green elements long straw. Add a long straw, and connect to the purple element, creating the upper hexagon.
10. Add 1 long, 1 half, 1 long straw, and connect down to the mustard yellow straw. Feed the wire up through the just added element.
11. Add 1 half straw, and connect to the next rectangle (marked with light pink).
12. Add 3 quarter straws, and connect down to the next corner of the light pink element.
13. Repeat steps 11-12 twice with the next elements, so that you'll have 3 levels of connected hexagons. By this time you probably already no system. feed the wire up through the last-added quarter straw, add a quarter straw and connect to the next little rectangle, feed the wire through the upper quarter straw of that element, add another quarter straw and connect with the next little rectangle until the fourth hexagon is formed. Secure the end of the wire by wrapping it a couple of time, cut and feed the tail into a nearby straw.
14. Hide all the wire ends.
What you'll probably notice now is that the finished pendant doesn't look that pretty, it sort of lopsided and the straw ends are a mess. So, you product right now looks like the one on the left above, yet, you want to make it look like the one on the right. Believe me, I was pretty frustrated at first, since all the DIY versions of Himmeli wreaths and similar geometric pendants looked so much better than mine. But, I figured out a solution.
All you need is to cut some Tetris pieces out of felt. Cut a 2x2cm piece of felt into a cross, and then replicate another 11 of them. So, all in all 12 crosses. Then cut another cross, but cut one side off, so it's more of a T. Make a total of 12 of those as well.
The way this works, is that you need to feed the ends of the crosses into the straws at each joining point. Use the cross where 4 straws meet, and the T where 3 straws meet. Makes sense, right! After you've done them all, I promise you will see a huge improvement. What this also does, is hide all the visible wiring. When you look at it from afar, it seems like it's one continues fixture.

Now, the fixture might still be a little crooked, so place it on a table, and bend it which-ever way needed to align the sides of the 4 hexagons, and make sure they are level, until your happy with the result. 
For the wiring of the light, we use the cheap IKEA light sockets. My pendant came out just a tad too wide at the top, so it wouldn't stay on the wide plastic above the light bulb (I have no idea what that part is called). So, I found a metal ring from another light fixture we have in the basement, and glued it to it, and placed that one between the two parts I can't name. if your light  has a wider placement thingy, you might be able to just take that off, place the pendant, at put it back on as a stopper of sorts. Ok, I hope this whole paragraph make at least some sense to someone.
I'm super proud of our new kitchen light fixture. It's awesome! Seriously, it looks like something from a high-end modern design store, yet the whole pendant light (with the wiring) cost me around 7€. Win!

This project seriously got my creative wheels spinning. I started to come up with more and more ideas to make for our home. Something I thought about was how there are so many tutorials of DIY home decor out there, but how a lot of them use materials I just don't have access to, or that are so expensive, that I can't make them on my budget. So, I was determined to come up with project that could all be made with very common materials, which would be free or cost very little, and make awesome decor out of them. Boom! An e-book idea was formed. So, for the whole week I've been in creative overdrive, sourcing materials (which also meant going through our garbage bin), and making projects. I'm so excited to get this e-book ready and out into the world. 

I'm hoping to be done by the end of next week. The e-book will contain 10 projects, plus extra tips and ideas for altering the projects. And the cost will be around 5-8€. What do you think? Are you as excited about it as me?

Also, I'm sending my lovelist (aka the mailing list) one of the tutorials for free. So, if you haven't signed up yet, you might want to (fill in the form in the sidebar, or click on the tab below). (Or, you might not, that's ok, too. We're still friends.)

Next Post Previous Post Home