Photo Post
Hi teal, nice to meet you.Trying to play around with the colours for the portfolio site. The original four boxes are different shades of blue. To contrast with that, I thought teal will be a good colour to hide behind the boxes when they expand.This is the colour palette I will use and their respective pages.The pale tone colours work well compared to stronger colours which are quite overwhelming.Good tip for minimalists, pale tones are your best friend and lover.

Hi teal, nice to meet you.

Trying to play around with the colours for the portfolio site. The original four boxes are different shades of blue. To contrast with that, I thought teal will be a good colour to hide behind the boxes when they expand.

This is the colour palette I will use and their respective pages.

The pale tone colours work well compared to stronger colours which are quite overwhelming.

Good tip for minimalists, pale tones are your best friend and lover.

Posted in development work portfolio UI design colour design web design palettes colourpalettes
| 6 notes

Comments

Photo Post
I have been working on my portfolio site last night.Four simple boxes in different shades of blue. I like the colour blue, especially using the colour with pale tones.So the idea is when you click on a box it will expand covering the whole screen. I have yet to work out the colour palette for those boxes behind the initial four boxes.Closing the box will make you return to the main screen. I will also have different transitions when viewing my work which will pop up.These effects are done with CSS transitions and with JavaScript.The icons you see next to the text are not graphics. It’s a webfont called  Raphaël Icon-Set. So you might be thinking, what if the user hasn’t got the font installed on their computer? Well, that’s fixed using the CSS rule called @font-face:@font-face {    font-family: ‘raphaelicons-webfont’;    src:url(‘../fonts/raphaelicons-webfont.eot’);    src:url(‘../fonts/raphaelicons-webfont.eot?#iefix’) format(‘embedded-opentype’),        url(‘../fonts/raphaelicons-webfont.woff’) format(‘woff’),        url(‘../fonts/raphaelicons-webfont.ttf’) format(‘truetype’),        url(‘../fonts/raphaelicons-webfont.svg#raphaelicons-webfont’) format(‘svg’);    font-weight: normal;    font-style: normal;}If you’re using another webfont, just replace raphaelicons-webfont with the exact name of your font. Also note, for the font to show, you also need to include this in your CSS:.icon {    font-weight: normal;    font-style: normal;    line-height: normal;    font-family: ‘raphaelicons-webfont’;    font-size: 7em;    position: relative;    top: 0.1em;    display: block;    margin-bottom: 10px;}I have added a few elements here, so it maybe different for your needs.I have no idea when this will be finished, since I have so much work to show. There’s a bit of work involved in polishing screenshots, adding text and working out the transition. I might initially load it with some designs I have done for large corporate clients and gradually add as I go along. With that in mind, this layout is almost complete thanks to pre-existing code and some custom alterations.

I have been working on my portfolio site last night.

Four simple boxes in different shades of blue. I like the colour blue, especially using the colour with pale tones.

So the idea is when you click on a box it will expand covering the whole screen. I have yet to work out the colour palette for those boxes behind the initial four boxes.

Closing the box will make you return to the main screen. I will also have different transitions when viewing my work which will pop up.

These effects are done with CSS transitions and with JavaScript.

The icons you see next to the text are not graphics. It’s a webfont called  Raphaël Icon-Set. So you might be thinking, what if the user hasn’t got the font installed on their computer? Well, that’s fixed using the CSS rule called @font-face:


@font-face {
    font-family: ‘raphaelicons-webfont’;
    src:url(‘../fonts/raphaelicons-webfont.eot’);
    src:url(‘../fonts/raphaelicons-webfont.eot?#iefix’) format(‘embedded-opentype’),
        url(‘../fonts/raphaelicons-webfont.woff’) format(‘woff’),
        url(‘../fonts/raphaelicons-webfont.ttf’) format(‘truetype’),
        url(‘../fonts/raphaelicons-webfont.svg#raphaelicons-webfont’) format(‘svg’);
    font-weight: normal;
    font-style: normal;
}


If you’re using another webfont, just replace raphaelicons-webfont with the exact name of your font. Also note, for the font to show, you also need to include this in your CSS:


.icon {
    font-weight: normal;
    font-style: normal;
    line-height: normal;
    font-family: ‘raphaelicons-webfont’;
    font-size: 7em;
    position: relative;
    top: 0.1em;
    display: block;
    margin-bottom: 10px;
}


I have added a few elements here, so it maybe different for your needs.

I have no idea when this will be finished, since I have so much work to show. There’s a bit of work involved in polishing screenshots, adding text and working out the transition. I might initially load it with some designs I have done for large corporate clients and gradually add as I go along. With that in mind, this layout is almost complete thanks to pre-existing code and some custom alterations.

Posted in development work web design css javascript webfont portfolio ui design ux design colour design
| 8 notes

Comments

Quote Post
While conversing today, even though we are speaking the same language, what people say sometimes seems so foreign to me.
— Excerpt from Question 9 By Michael Daaboul
Posted in quotes quotes filter language foreign
| 40 notes

Comments

Quote Post
You have been waiting for someone, waiting for someone you have lost.
— Excerpt from Lost and Waiting By Michael Daaboul
Posted in poetry quotes quotes filter heartbreak love lost relationships
| 53 notes

Comments

Quote Post
She wanted to hold you for one more time, so she could feel you for the last time. Slowly, she started to drift away from you and drifting further away was all she did.
— Excerpt from Floating Away By Michael Daaboul
Posted in poetry quotes quotes filter heartbreak love relationships
| 52 notes

Comments

Quote Post
You notice how she isn’t there. You dream about her and you ran your fingers through her hair. Her eyes were closed and her mouth smiling. Was she real? Was she ever really there?
— Excerpt from Summer Morning By Michael Daaboul
Posted in poetry quotes quotes filter love relationships fear
| 237 notes

Comments

Quote Post
Summer morning, beautiful warm air, roll over and feel her, she is right there. Run your fingers through her hair, close her eyes as you notice how her mouth is smiling, you take a deep breath as you sit right there.
— Excerpt from Summer Morning By Michael Daaboul
Posted in poetry quotes quotes filter love relationships summer
| 39 notes

Comments

Quote Post
The words that you send to me are too small for me to feel anything. I’m rolling along, in this night, I fear nothing.
— Excerpt from Midnight Winter By Michael Daaboul
Posted in poetry quotes quotes filter love emotions fear
| 36 notes

Comments

Quote Post
Your eyes are my stars tonight.
— Excerpt from Midnight Winter By Michael Daaboul
Posted in poetry quotes filter quotes love
| 57 notes

Comments

Quote Post
If I am hiding, will you come out in this cold to find me?
— Excerpt from Midnight Winter By Michael Daaboul
Posted in poetry quotes quotes filter love cold winter
| 47 notes

Comments