New portfolio idea- feedback needed!

Discussion in 'Web Design and Development' started by ildar, Nov 1, 2011.

  1. ildar macrumors newbie

    Joined:
    Nov 1, 2011
    Location:
    Toronto
    #1
    Being a web designer, my own website's purpose is to show the work I've done for others. So I had an idea: show websites I made inside my own website, and kinda do a tour of the different pages... Like a tiny description can be shown at the bottom of a page (working on that). Would love feedback on what I have so far.

    http://www.samitwebsites.com/

    Let me know if you experience any difficulties using the site, too.

    Thanks very much in advance,
    Ildar :apple:
     
  2. njchava, Nov 1, 2011
    Last edited: Nov 1, 2011

    njchava macrumors newbie

    Joined:
    Jun 15, 2011
    #2
    i love the transition effect! and the typography and design! what is the name of that jquery/html5/js whatever transition effect frame thing? please do share.

    Constructive Criticism: for a portfolio, I'd like to see a little more about yourself, and about your work, and each project. Otherwise it seems like just a bunch of links.
     
  3. ildar thread starter macrumors newbie

    Joined:
    Nov 1, 2011
    Location:
    Toronto
    #3
    Thanks for the kind words, njchava! :)

    I wrote all the JavaScript using YUI... I'm starting to love it even move than jQuery. Beyond that, it's all custom code. It's simple though, so feel free to look through the source!

    Actually, the code in some of my client work is more interesting (also viewable from source).

    Let me know if you have any questions or need any tips on how to do these kinds of things.

    Maybe you're right, I need to write a few words about myself to make it a bit more personal haha... And yeah project descriptions would probably be nice.

    Thanks again,
    Ildar
     
  4. EvryDayImShufln macrumors 65816

    EvryDayImShufln

    Joined:
    Sep 18, 2006
    #4
    Wow very nice site! I like the navigator between sites: easy and simple, yet effective.

    I agree with Njchava about having more information about yourself.

    One other minor criticism: I found the logo on top to be lacking in terms of resolution, or maybe smoothness.
     
  5. nomade macrumors member

    nomade

    Joined:
    Dec 2, 2006
    #5
    Your Web site is beautifull, original, simple and well thinked.
    One minor thing is: When I choose a project there's a fairly long lagtime before I see something appearing. I was not sure if it was working or not. And then the stuff appear and everything work fine. :)
     
  6. Hansr macrumors 6502a

    Joined:
    Apr 1, 2007
    #6
    Looks great, but I agree with above. Ad more information about yourself + contact form/info etc.
     
  7. njchava macrumors newbie

    Joined:
    Jun 15, 2011
    #7
    ildar i have never used jquery, but i have a good idea for an upcoming little project i'm working on.

    All I want to do is have a page with 2 images. One transitions left to a new page and the other one transitions right to a new page.

    I have your code running correctly on my localhost, but I'm having trouble tweaking it to what I'm trying to do.

    Can you help me out or point me to some good reading material about how to do this with YUI?
     
  8. Hansr macrumors 6502a

    Joined:
    Apr 1, 2007
    #8
  9. ildar thread starter macrumors newbie

    Joined:
    Nov 1, 2011
    Location:
    Toronto
    #9
    I used to love reading the forums here, but participating in them turned out to be a whole new level of fun! :)

    Thanks everyone for the comments. They're much appreciated.

    njchava:

    Most important resource for you is the official docs.

    YUI allows you to do is gradually change a numeric CSS value from what it is at the moment to whatever you want it to become. So you can go from 'marginLeft' from 0 to 100px in 1.5 seconds, for example.

    So first, position everything on the page without any Javascript at all... just use CSS. So in your case, you can do:
    #page-one, #page-two {position:absolute; top:0; width:100%; height:1000px;}
    #page-one {left:0;}
    #page-two {left:100%;}

    And you want that to gradually change into:
    #page-one {left:-100%;}
    #page-two {left:0;}

    And then back to original:
    #page-one {left:0;}
    #page-two {left:100%;}

    Or you can use floats, whatever. The point is you can animate those CSS values as you wish.
    (of course, you need those elements with IDs: #page-one, #page-two, #button-left, #button-right)

    Here's the code you can use:
    (See http://yuilibrary.com/yui/docs/event/ and http://yuilibrary.com/yui/docs/transition/)

    YUI().use('event', 'transition', function (Y) {

    // To go right:
    function handleClickRight (e) {
    Y.one('#page-one').transition({
    left: '-100%'
    });
    Y.one('#page-two').transition({
    left: '0'
    });
    }

    // And to go back (left):
    function handleClickLeft (e) {
    Y.one('#page-one').transition({
    left: '-100%'
    });
    Y.one('#page-two').transition({
    left: '0'
    });
    }

    Y.one('#button-right').on("click", handleClickRight);
    Y.one('#button-left').on("click", handleClickLeft);

    });
     
  10. wrinkster22 macrumors 68030

    wrinkster22

    Joined:
    Jun 11, 2011
    Location:
    Toronto
    #10
    I really like everything. It is try clean and smile and elegant... almost apple esque..
    I like how your site follows the motto "simplicity is the ultimate sophistication"
     
  11. ildar thread starter macrumors newbie

    Joined:
    Nov 1, 2011
    Location:
    Toronto
    #11
    Thanks, eh! ;)
     
  12. Laird Knox macrumors 68000

    Joined:
    Jun 18, 2010
    #12
    When I clicked on Preferred Custom Homes (first one I clicked on) I thought it went directly to that web site and was a little put off. I understand how your navigation works but it wasn't all that clear at first.

    Not sure what you can do to help that. It is possible to put the pages in a frame to show that a visitor is still on your site. Or an overlay perhaps? I dunno.

    Otherwise the navigation works well.

    Also, have you thought about how the landing page will work when you have ten web sites to show off, or 100?
     
  13. ildar thread starter macrumors newbie

    Joined:
    Nov 1, 2011
    Location:
    Toronto
    #13
    This was one of my worries, and the reason I'm asking for feedback haha... Thanks for your comment!

    I made the transition a bit slower, and I'll have to get the "back" button to work... I'm thinking: even if the person thinks it's a different website, the way back is still the same.

    It's not about how many websites I can show there... it's about how many websites a busy person will be willing to look at before deciding on whether to hire me or keep looking for someone else.
     
  14. Laird Knox macrumors 68000

    Joined:
    Jun 18, 2010
    #14
    It isn't really iPad friendly. The landing page doesn't quite fit and you can't scroll horizontally to see the linked sites.

    Rotating the iPad requires a browser refresh for things to work as intended.

    I know you can get back. I do like the methodology but can't think of a better implementation at the moment. That was just my initial reaction.

    Fair enough. ;)

    When I looked at the page the sample tiles where a bit too wide. My first thought was how were you going to grow it. If it is a showcase of you top designs then that's fine - there can be another page for a comprehensive list if you desire to show more.

    You might want to make your CSS a bit more dynamic. The five tiles would have easily fit in my browser but the were being pushed out of the window. I run my office displays at 1200 x 1600 (portrait) so my browser was probably around 1000 pixels wide at the time.
     
  15. wrinkster22 macrumors 68030

    wrinkster22

    Joined:
    Jun 11, 2011
    Location:
    Toronto
    #15
    your welcome fellow torontonion!
     
  16. ildar thread starter macrumors newbie

    Joined:
    Nov 1, 2011
    Location:
    Toronto
    #16
    I tweaked the site a bit for now, should work better. More fluid CSS might be best thought, you're right.

    I was thinking of eventually categorizing my work by industry... So a lawyer can view all websites I made for lawyers, etc.
     

Share This Page