I can hardly imagine what others feel but every birthday for me is like worldwide holiday. I smile to everyone and become a bit surprised that not every person I meet greets me. Some of them are even not smiling. So when my father’s birthday happened I wanted him to feel like it is worldwide and made people who aren’t acquainted with my father to frankly greet him with a smile. In order to achieve that result I place a picture (see the top of the post) to my Facebook and made a little description for it:

Today is a perfect day! The day my father was born. When I am asked to fill parents’ occupations I always say ‘The Headmaster of the Internet’ because noone should know he is ‘The Headmaster of the Universe’. I’ll tell you a couple of facts about my father so you won’t be unacquainted anymore and would greet him as a friend.

You can watch this post on Facebook (if you can’t see the post it’s the good reason to friend me there) or read the facts here. I sorted them starting with the fact that was liked more than others:

17 likes My father is allergic to antiallergic drugs. When he was prescribed sedative pills he became quite nervous.

15 likes My father is always the center of the company and is never importunate as his son sometimes is. When I was a child I asked my mom if I would joke like my father when I grew up.

15 likes My father does everything perfect. He likes to plan everything and do it right. We joke about his first step that is to create originally scaled mockup.

15 likes My father would never believe I am a grown up no matter how old he is.

14 likes My father taught me to nail when I was little child. We spoiled the floor cover but told mom nothing.

13 likes I don’t name my father father. I address to him by his name “Valerchik” whack is short for “Valery” (unlike Valery you thought about its a male name ;) Some people are shocked by that and have different theories why it’s so but the answer is simple and clear. We’re just friends. When I was 5 years old my father punished me forbidding to call him other way then father. He had enough patience to wait for a couple of days and then offered me to call him by name again.

12 likes My father is responsible that’s why he spends a lot of time on his work and is very disappointed and nervous when something goes wrong. We try to keep him at home but he is so disobedient.

9 likes My father adores beer.

After these facts there were tons of greeting from my friends, people I know and just good people. Some of them knew only me, some of them knew me and my mom, but only in Facebook, and some even knew my father in person. When we gathered together at 6 p.m. to celebrate I gave him the ipad with the Facebook post opened so he could enjoy the greetings. That’s way better then 50 cents card.

Decoration

Lays package, front

Here is very neat and sweet decorated Lays package. We can see it’s Lays and it’s Baked. No information about weight or best before, but the picture is awesome — that’s decoration, not the design.

Design

Pingo Doce drinking water and potato crisps (chips) package back

As Pingo Doce is a private label of Pingo Doce foodstores, those, who created the package thought about cashiers trying to catch little bar codes with those red rays in their scanners. That’s why bar codes are long enough so any cashier could easily scan them even if part of the bar code is damaged. That’s design.

***

Good design can be decorated quite wonderful, but good decoration would never make bad design work.

Hard to say, easy to do. That happens every time we do something fun with akella. Last year we made a reader for iPhone and iPad in 33 hours and yesterday we took part in CSS1K. It’s a challenge for coders to decorate the page with pure CSS in less than 1024 bytes. I made the decoration while akella coded everything. You can see the result before reading the post: Bbubles. Please also note that the file with this design saved (no animations, no links) is more than 20 times bigger than the CSS used to decorate and code it!

The content must be hidden until the roll over, then the circle grows up to fit it. It would be perfect if background stroke would be like liquid surrounding the circles but I doubt it is possible within the bounds of rules. Pew-pew-pew! — that’s what I told about this thing ;)

While akella was coding I chose the colours, so the colour codes would be 2 times shorter. CSS allows to shorten similar codes like #ffffff (white) to #fff. So the colours were:
#ccdd22 → #cd2 (green)
#eeeedd → #eed (background)
#ddddcc → #ddc (dark circles)
#444444 → #444 (text)
#ffffff → #fff (links background)

And the whole design brightened up:

It became obvious while coding that circles can’t be placed and act exactly as we wanted within the limitations, so akella placed them in the apexes of triangle and I improved the decoration.

Result still differs from the last mockup but not so much. When everything was ready I took a part in prowling the CSS in search of things to optimize. I made the code more than 10 bytes shorter with my offer to replace sans-serif with Arial (though it is not so standard and professional but still works), replacing 1.3em with 18px (it finished up as 130%) and others. I think there have to be more tips and coding tricks in akella’s post on CSS1k.

We had a great time taking part in this CSS1K thing and scored something that looks to me like jackpot: Bbubles.

Iodinated seafood party together ignoring the scale

It’s half past three in the morning and I write this post while the book about use of iodized salt in bakery is printed. Infographics and tables I wrote about couple of weeks ago (Infographics Howto: Iodide! Iodate!) were used on the pages of this book. Some of them changed a bit, others changed a lot after discussions and specifications of charts targeting. Furthermore there happened to be two books not one as it was expected at the beginning. The second one is thinner about use of iodized salt in Denmark. I’ll write about changed charts at first and then I’ll describe the books makeup process.

Infographics

Some graphs wished to stay on certain places on the pages of the book so it would be easier to read them. Other graphs were disturbed with the fact they can visualize more information they visualized in the prior editions. More graphs just wanted to be even more handsome.

Culinary treatment impact on iodine contents in seafood (Fig. 1, page 8)

Usage of iodinated additives to impact iodine concentration in bakery (Fig. 2, page 23)

Captions on this graph were moved below so they won’t mess with the figure caption.

Impact of iodized salts on dough smearing (Fig. 3, page 30)

The long way I made selecting and composing the appearance of bars ended with simple solution. Though it looks obvious all prior steps were needed not just for this graph but also for other charts with bars in this books, including the first one described above.

Impact of iodized salts on gasification ability of the flour (Fig. 4, page 31)

As long as numbers are too close that would be to impossible with just scaling them to feet the page width. That’s why the bars have the parallel similar parts withdrawn so the difference is shown zoomed in. The skipped parts are properly marked.

Growth of the diameter with the lapse of time (Fig. 6, page 33; Fig. 7, page. 34; Fig. 9, page 36)

All three charts visualizing the growth of the diameters of colonies and mycelium with the lapse of time changed too. They now look less avant-garde while colour coding and captions are now more readable and obvious. I would send the prior edition to biennale while letting the second to find its mission in book.

Layout

Finished book in Russian is available for download in PDF (1,5 Mb). It is also available in miniature:

I start with the statement I was in a horrible rush and even though I tried my best to work on every line I’ve must have skipped something. I understand it’s not ok but I’ll try to live with that. I was in a lack of about a week and about a box of Portuguese vino verde ;)

I have a thing and a pony who helped me. Pony is bo, who edited the whole text way more readable than it was in source. The book is ‘Manual for Publisher and Author’ by Milchin and Chelcova.

Everything started with the grid which was then implemented in second book too.

Grid is flexible enough to work for one and two column layout (mouse over spreads to see the grid for them)

Grid works for one column layout with wide external margin and two column layout with equal margins. Two column layout is used particularly for appendix which is the separate document to show it is not part of the book text while it is part of the whole book.

Graphs and tables in both layouts are wider than text part. That makes reading more dynamic and pleasant. They are also placed after the text they illustrate to make reading more straightforward and one-directional.

Some tables were rotated 90° to make them more readable. The contents of table cells was aligned the way it would be easier to compare the data.

(Table 3, page 27)

I removed some obvious column headings to minimize redundant information.

There seemed to be a problem when I started working with appendix. As appendix is a separate document it has the separate page numbering. I spent and hour and a half to force Indesign to make it automatically but hand to place page numbers by hand ;) Appendix page numbering is placed on top of every page aligned to external edge.

Hint for Mac OS X users: you can use default application called Grapher (Applications › Utilities) to format mathematical formulas. After the formula is edited in Grapher copy it to the clipboard and paste as PDF to any application that supports that.

After I was to tired to even look at the book I made I started the creation of table of contents. As I worked with Indesign styles it was easy to compose TOC in couple of clicks but I wanted to use the whole spread and make something more creative.

I finished with way more traditional TOC so readers won’t be distracted starting from the third page.

The same decoration was used for appendix table of contents.

‘Dutch’ Book

This book in Ukrainian is also available for download (PDF, 706 Kb) and can be the fist for the eyes in miniature

The main problem with this book was insufficient number of pages that’s why one column is stretched on two column width. The tables don’t hang wasn’t so expressive but still dynamic.

Though the tables were more readable then in first book I still had to edit them.

(Table 3, page 10)

I united age groups with colour, made the left column more readable and changed the header so the table was easier to use.

It was a pity I had no source of the chart so I had to work with what I’ve got. To place make it more appealing and fit it into the layout.

(Chart 1, page 11)

I retrieved chart from PDF, made bars width equal and added marks on the left so the reader could estimate data concentration.

(Table 4, page 11)

One more long table was separated in two columns and it’s subheading was contrasted. Changes made table more readable and thus easy to use.

***

I saved all the fils, sent them to publisher and didn’t look at them for a couple of days. And now, when I am not sick looking at them, at three thirty in the morning I finalized the story of book creation. Pretty, usable and readable book made out of not so clear for the reader sources.

Hands up everyone who threw away macbook or ipod packaging with no regret. Good news: you are minority ;) Every one of us adores nice packaging sensation even if we don’t realize that. One can either create new cool box, either improve the idea that is used everywhere to make a packaging that feels nice.

Jolly colorful Kotex tampons on the left and random result from ‘tampax’ search query

Kotex makes hygienic tampons as their competitors do. I can’t say if tampons are good or bad, but my girlfriend uses them so I at least now they exist ;) The interesting thing about Kotex tampons is that it’s very easy and enjoyable to uncover them: just twist both end9s of the cover in opposite ways. The cover would wrap along perforation and the tampon would be ready to use. Furthermore, fixing one of the ends in your hand would allow to hold uncovered tampon by covered end without touching the tampon itself!

It is natural scenario for girls and women to hold one end to twist another. That’s the way to open nail polish, lipstick, mascara etc. It seems obvious that images used for Kotex packaging aren’t accidental

This way of opening the tampon is faster and easier than waste the time searching for the flap to pull like on the pack of cigarettes. So Kotex improved the usual and not the easiest action and made the addicting scenario out of it. They’ve just thought how to improve the working scenario.

***

While searching for post illustration I’ve seen Kotex has payed much attention to packaging and usability of its products. I am not sure if the competitors do the same but it would be interesting information to know.

Iodine Makes Me Clever tshirt print (dribbbbbbbble edition)

It looks like I am absolutely out of time and won’t be able to translate this post into english for a long time. So let’s consider pictures really worth a thousand words and enjoy the examples of the charts and graphs I made for the book about use of iodized salt in bakery.

(Info)graphics

I made a long way searching for the visualization of dough smearing

I had to rotate almost every table in the book 90° so it would be readable. People who made them didn’t understand how data in cells is compared.

***

The tables and charts are in Russian and there is almost no text but don’t get sad, post in English about how the whole book was is here:

Iodide! Iodate! — 2
Data Visualization on Stream and Books Layout Explained

Sign on the door of the office I share with Bo

I wrote a column for Yeti News about branding using game technologies which is a mix of one and a half clever thoughts and something stupid. If you’re good in reading in Russian, you are welcome to read my column.

Me wearing tshirt (photo taken with coffee mug, the quality is adequate)

I’ve suddenly won a tshirt from vitamins. The print is Marylin formed with sliced fruits. The quality of the tshirt with 100% polyester outside and 100% cotton inside is perfect. The quality of the print is good too.

Thanking the tshirt I’d like to give the vitamins a good advice. If you want your tshirt to be worn elsewhere home: to the Toshoshop birtgday, to the night club or even to the vacation in Lisbon, then avoid placing the huge logo right in front. Especially try to avoid such things if the logo isn’t integrated into the print. There are a bunch of places to place the logo: gently on a sleeve, endearingly on the back side under the collar, comfortably at the bottom in front but closer to the seam. Having tshirt with logo placed that way I could answer my friends’ enviously admiring questions: “Where did I get this tshirt from? I’ve won it from Vitrum vitamins!

***

By the way there is no logo on a tshirt on
Кстати, на странице Vitrum facebook page.