Tip: Printscreen What You Love

Whenever I'm browsing the internet, I'm always on the lookout for awesome designs and graphic elements. If you don't know yet, I'm quite particular about what I like. I like intricate and different. Which really will not make my job of designing my own blog very easy, but I'm up for the challenge, no matter how long it takes.

So when I see a blog or website that I like a particular feature, I printscreen the part I like and paste it into a page of my Blog Design Section of my Blog OneNote Notebook. I mark down the website it's from and what I particularly like about the design: the layout, the color, the shapes, the doodliness, etc, so that there's no question later on when I go through all the websites I've noted down. I'll also write down if I think any changes would make the design even better and more to my liking.

Oh and BTW I use the program Gadwin Printscreen to manage all my printscreens. You have many useful options with this simple program, like printscreening the entire screen, just the browser window (I think), or choosing a rectangular area yourself. You can either chose to have the cursor in the image, or not. And it will save all your printscreen images to a folder on your computer, in case you don't want to paste it anywhere but just keep something for future reference. Of course it also copies to your clipboard (that virtual memory that remembers the last thing you either printscreened of copied, be it text or image) so you can paste it somewhere (in my case my OneNote) before taking an other printscreen.

The reason why I printscreen as opposed to just mark down the website whose design I like is because you never know when they will decide to change their design and your inspiration is gone. There are many designs in my OneNote that have since changed, and I'm so glad I decided to printscreen it!! Sometimes I'm even sad to see the design go because I really loved it.

I wouldn't use the printscreens (images) on the web just to show what I like without having asked permission first to do so, which is why there are no images here to illustrate my point. Maybe one day I will take the time to ask around to share, we will see.

I also have a page more for graphic elements that I like. I've looked a lot through scrapbook kits and scrapbook element designers websites to get inspiration and elements to use in my own design (mostly for free), and I've decided to try and make my design elements mostly from scratch, either from doodles I hand drawn (I'm not very good at drawing though...) or free shapes around the internets.

In that regard, I TRY to pin free stuff I like to my Free Digital Art Pinterest Board. I could be better at this though. But if you're in the marker for great scrapbook like designers, you can look through there. There's a lot of fonts in there too.

That's my tip for today!

Continue Reading...

Research, Pt 3

Yesterday, I read the eBook I referenced in my 2nd post. Well, it didn't help any. It was basically a guide to help you choose a premade template. Or well that's what I got out of it. There were the very very basic customization of template (change the background image, font and color, I think) but that was it.

BUT, I did found a pretty awesome website with very good tutorials to customize your blogger template. It's Help Logger, and I've found quite a few new tutorials for customizing things I didn't think you even could, like removing the Powered by Blogger note at the bottom of the template.

I'm going through some tutorials and saving the ones which I would like to implement down the line. So many things to customize, it's gonna take a while!

I did want to share how I am organizing my saved links for future reference. I use OneNote Notebooks to organize pretty much everything in my life right now. I know some people like paper notebooks better, but I seriously think that electronic Notebooks are becoming more and more useful because we have so much electronic information to keep track of, and printing is so wasteful.

So I have a OneNote notebook dedicated to my Blog, and a Section for my Blog Design. I've got a page in there that I'm collecting links to tutorials and they are separated by which section the tutorial is for (header, post, sidebar, footer, social media etc).

Sometimes, you don't know you want to customize your blog a certain way because you don't even realize it's possible. This way, I'm perusing different tutorials and noting what I CAN do, and later I will chose what I WILL do. I'm still curious, because most tutorials only tell you what you need to know for that tutorial, and might not give you all the options possible. I wonder how much more you could customize beyond just that tutorial but still the same element.

I want to make a sorta series on how I use OneNote on my main blog Color Me Domestic, because it's really like my ultimate resource for absolutely everything, and I'm sure others can benefit from it too. All in due time I suppose.

Continue Reading...

Research,Pt 2

ACtually, you know what, if I'm to do this, I'm gonna do it right (well until I get too lazy to write it all down). I'll document here, or try to, everything I read and my thoughts. Maybe this could be useful for someone else, to see the thought process that goes behind designing a blog.

First let me say I am BY NO MEANS a proffesionnal. I don't even know if I can say I'm an amateur because I've done all of 2 designs. I will count my LiveJournal "blog", that is how I learned HTML and CSS and when I started learning how to tweak both, even if only very very rudimentarily. Then I did my own blog design at Color Me Domestic, but that was a lot more graphical design and I didn't touch too much the template code except to add a couple of widgets.

So now that that is out of the way, I'll say this. If you like this stuff (I mean coding and designing) then your hard work is all that stands in the way. I'm positive I will come out of this with my own personnal made template and graphic elements. It may take a while, because I have other things I SHOULD focus on (*cough* writing my thesis *cough*), but this is more fun.

Complete side note, I did something yesterday that is making me very very happy today, even though it is SUCH a trivial thing. What is it? I cleaned my keyboard. Yes I know trivial. I popped off every key and rubbed them all with 50% ethanol (I think, why does the bottle not clearly label what type of alcohol is in there?! that's what we need to do at the lab!). And then I cleaned under the keys. There were so.many.crumbs it was DISGUSTING. Anyway, so now as I'm typing this, because I only sorta have my "doighté" (I don't know the english term??? you know when you don't need to look at your keybooard when you type?) I CAN do it, but my eyes always go back to looking at the keyboard, it's just faster. Anyway, yes I am just so happy inside that it's so clean and beautiful. I need to do my boyfriend's keyboard next. It's 10X worst than mine was.

Ok back to topic. Which was....I don't know. Where was I going with this?? Ok, documenting I suppose.

I read this series yesterday, dating back to 2007, about the basics of a template. Quick enough read, and I think it's important to understand the anatomy of a template before you start messing with it. Here: http://www.ourblogtemplates.com/2007/06/tutorials-on-blogger-template-design.html

This doesn't mean I understand everything that is written in the template, but I know the parts, which is a good start. I think it's important to really UNDERSTAND this stuff, only then can you really make something truly unique.

Next. I need to read some articles from http://www.w3schools.com/ They were referenced over and over again in the series above, and they are still up to date. I think this will really help in know what the different codes are in the template, and the different options are for changing them.

My problem right now is that I have a ton of tabs open with different articles and series about web design. I kinda have ADHD when it comes to this stuff... Which is why I am referencing here what I find that I want to read later (I suppose I could also use Pocket)

And a couple more things I want to take note of if I need it later:
1. http://styletil.es/ Love the look of this site (the doodly-ness, that's what I want in my own blog, but I've not too good at drawing or anything, so we will see how that pans out). Looks like it would be good to help you establish what you want your blog or website to look like, the layout, the color scheme and the fonts, they mention.

2. Tools for responsive design http://www.hongkiat.com/blog/rwd-tools/ 50 of them

3. Blogger Template Design series start here: http://www.bloggerbuster.com/2008/01/creating-three-column-or-wide-two.html I guess. The baellabel (holy cow that was a messed up typo, I didn't even know at first what I was trying to say1) for the serie doesn't work, and there's no table of contents type page. Still seems like it's well written and easy to understand.


~~~
Alright, so I went through the CSS tutorials on W3schools. While I learned some tricks and got some ideas as to how to do some of the things I want to do in my template, it was not specific at all to blog templates. I do think I have a better grasp of how to write CSS, the difference between id and classes, but it also brought up a lot of questions. So I'm off to find something more relevant to blog template css. I think I'll read through blogger buster now. That might be all I do tonight.

Oh and I just found this free ebook about blogger template design, I think: http://blog.themeforest.net/installation-guides/free-e-book-the-blogger-template-book/

TBC...

Continue Reading...

Research

Hello, this is my test blog for testing my new blog design over at Color Me Domestic.

I am writing test entries to verify that everything works as intended, and I thought I'd document my progress here as well, kinda more journal style. It won't be pretty, and I'll probably ramble on a lot, but it doesn't matter. I doubt many people will read it.

So I started my new blog design officially in February. I made the logo and background, and then it kinda came to a stop. Isn't it weird how the more you use your creativity, the more you WANT to use it. I find I have to make a great effort to get going, but once I've started, it's hard to stop.

Needless to say, I stopped after making those and didn't really picked it up again. I thought about what I wanted a lot though, I just didn't really research it more until this week (April 15-19).

Now i really want to make my own template from (almost) scratch. And I want a responsive design. What's a responsive design you ask? Well, it's when your design adapts to the size and shape (or resolution) of your screen, no matter how big or small it is. This means that your blog can be the best it can be for big PC size screens AND small phone screens. And also different if it's landscape or portrait. Yup it's possible! It's the new way to go. It's all thinking about the future and making your website fit future devices.

Not only that, but some elements of the blog design move around as the screen sizes change. It really is so cool! Oh and your images, text size, etc, also adapt as well. Want to see a few examples? Of course I've been reading all of this at work, so I don't have the articles that I was reading just now, and I don't remember what I googled bc googling just now doesn't give me the same stuff.

Here's a few sites I need to check up on that look quite useful for designing responsive designs:
http://bradfrost.github.io/this-is-responsive/patterns.html also has one more responsive image maps which I will most probably need.

Anyway. So I've been looking to start with, at how to build a template from scratch on a normal blog, ie not responsive, because well that's the basic. I already know and understand a bit of CSS, but I think I have a long way to go still. But it really all makes sense when I read it, it's not gibberish, so that's good! I don't know why this stuff intrigues me and I don't get bored. I'll leave it at that for now and continue looking around and learning :)

Continue Reading...