25 comments

  • adrian ioadrian io, almost 6 years ago

    Nice visual design, looks clean and easy to read. However I'm not too sure about the changing of colour when you hover over the projects, felt a bit jarring. White on yellow is also really hard to read. The colour should revert back to the original when you hover out to the left.

    Good work!

    2 points
    • Noureddine AzharNoureddine Azhar, almost 6 years ago

      Thanks for the feedback Adrian, I appreciate it :)

      0 points
      • adrian ioadrian io, almost 6 years ago

        A few more comments:

        • What are you trying to say with 'an ass that never quits'? If you google the phrase, it can have several meanings, one includes methane, one includes diarrhea or just having a great ass. I presume you mean you're working hard?

        • Clarification regarding the hover out, e.g. hover over 'Read case study' and then hover out to the left. The colour doesn't revert back.

        • The shadow for the 'Minimal football' cover picture is slightly cut off. PNG needs a bigger crop.

        Btw, digging your logos.

        1 point
        • Noureddine AzharNoureddine Azhar, almost 6 years ago

          Thanks for this Adrian.

          • Haha yes I'm well aware of the meaning of that phrase ;) I'm using it as a joke. Because not only am I a hard worker, but also I have a fantastic ass. For me this can be taken any way that the reader wants to, it's mainly there to show a bit of my personality.

          • Yes I noticed that too, unfortunately that's something that's proven to be difficult to fix. The background colour and image of each project are stored in each of the anchor tags' :before element and their z index is below everything else. So when you hover from one project to the other, or to any other element on the page it works fine. However if you go to an empty part of the page, for example to the left of it or the little gaps between the h2 tag above the project list it doesn't disappear. As I'm not using any javascript (minus GA and Typekit) it's not as easy to fix. But I will definitely see if I can find a way to fix it.

          • Thanks .for pointing that out, I'll update that asap!

          Thanks again for the feedback!

          1 point
  • Rik RoukensRik Roukens, almost 6 years ago

    Fantastic, really like it. Except for the changing color on the project hover. Bit to intense for me! Other than that, superb. (ps. hope your mom was a satisfied customer ;p )

    1 point
  • Cristian MoiseiCristian Moisei, almost 6 years ago

    Structurally, this is perfect - it provides all the right information in all the right ways, and it looks well built too.

    I am however curious about the identity you chose - those fonts feel pretty ugly to me, like default fonts of a corporate platform. I understand going for simplicity, letting your content shine through, but it does feel .. not designed.

    Still, it's a great site and I hope it serves you well.

    1 point
    • Noureddine AzharNoureddine Azhar, almost 6 years ago

      Thank you so much for your honest feedback Cristian!

      I think when it comes to personal branding (or any other piece of branding really) it's always going to get mixed reviews. Personally I love the Futura PT typeface :)

      0 points
      • Cristian MoiseiCristian Moisei, almost 6 years ago

        True, futura is nice, but it feels too simple here, too plain. Have you tried using different weights? Being such a versatile font, there are plenty of options to choose from: big imposing bold oblique, cool and technical medium condensed. Perhaps a smaller futura book for the body.

        Still, I could be wrong.

        1 point
        • Noureddine AzharNoureddine Azhar, almost 6 years ago

          While it may seem to you that not a lot of designing actually went into this, I assure you I didn't just pick the first typeface that popped into my head.

          Currently there are four different type classes used on the site.

          • The h1 class has a weight of 600 (demi), is in uppercase, is 82px in size and has 10px of letter spacing. This is strictly used for the first heading on each page and only there.

          • The h2 class uses the same weight (600/demi), normal letter spacing and normal letter casing and is 40px in size. This is used as a title for each different section in either the projects or the home page.

          • The intro class has a weight of 400 (book) and is 32px in size. This is used as the introductory body text for some longer sections, or as standalone large copy.

          • And finally, the regular body text which has a weight of 400 (book) and is 26px in size. This is used for any regular copy on the website.

          Also I don't think that you might be wrong in this instance, it really is one of those things that'll come down to personal opinion. At the end of the day my goal was to make a simple portfolio that is easy to navigate and read. Personal opinions on design aside, I think I've achieved that goal. Anything beyond that is going to be a matter of preference. But please don't take this long ass comment as me trying to show you that you're wrong or anything like that, your feedback is 100% valid and I really appreciate it!

          0 points
          • Cristian MoiseiCristian Moisei, almost 6 years ago

            You are right, it is my opinion and when it comes to details like this, I don't think there's one right answer.

            Again, nice work.

            0 points
    • adrian ioadrian io, almost 6 years ago

      Just to add another point of view here. I personally love the choice of typeface and not mixing too many styles / weights.

      And what does 'not designed' mean? Design is mainly about problem solving and I presume the goal for the site is to make it easy for readers to consume the information.

      Readability beats trying to go with something that visually might look trendy.

      Listen to this short interview by Erik Spiekermann about the sins of designers trying to use type to make something look good: https://www.youtube.com/watch?v=Sw0syzCeH4Q (enable english captions).

      You have other facets you can tweak to create a personal brand, such as tone of voice or copy.

      In this example, Nuro made it clear that he works hard (but secretly he wants to let the world know he's a designer with a great ass), leaving it a bit ambiguous for the reader.

      Not so corporate in my view.

      2 points
  • Thorsten LindbergerThorsten Lindberger, almost 6 years ago

    nice one.

    1 point
  • Jason Giglio, almost 6 years ago

    Nice to see another non-JS portfolio. It's super responsive. I did the same with mine.

    Are you using a static-site generator like Jekyll or Middleman?

    1 point
    • Noureddine AzharNoureddine Azhar, almost 6 years ago

      Thanks Jason. I love using Javascript, it's so much fun but I had absolutely no need for it on my portfolio and I'm pretty big on having reasons for doing what I do and not just throwing things in for the sake of it.

      No, everything is built from scratch. I was thinking about using Jekyll, but again I didn't really need to so I kept it as simple as possible.

      0 points
  • Markus BerghMarkus Bergh, almost 6 years ago

    I really like the colours. And a great transition from when you hover a case/project and enter it.

    I would like the scroll position state to be saved when you're going back from a case/project though. A lot of re-scrolling now. Also a link-to-top would be helpful since pages are quite long.

    The revealing footer effect is clean, I've seen it at some pages though. Well done!

    1 point
    • Noureddine AzharNoureddine Azhar, almost 6 years ago

      Thanks so much for the feedback Markus. Unfortunately as I'm not using any javascript (except for GA and Typekit for the font) I can't save the position state. However a back to top button is a great idea and I'll definitely look into implementing it when I next update the site.

      Thanks again, really appreciate it

      0 points
  • Account deleted almost 6 years ago

    It's really nice man. The changing background colours scared the bejeesus out of me and they're pretty damn bright. I like the copy and the type layout though. Nice stuff :)

    1 point
    • Eric BlattbergEric Blattberg, almost 6 years ago

      Seconded on the background color. A super-quick fade (maybe 100-200ms) could help make that less jarring, perhaps?

      1 point
      • Noureddine AzharNoureddine Azhar, almost 6 years ago

        Thanks for the feedback guys.

        I've purposely not used any javascript and because the background colour and images are attached to each corresponding project link fading them in instead of just changing from display: none to display: block might not be possible.

        But let me have a look and see what I can do. Again thanks for the feedback, really appreciate it!

        0 points
        • Jesse C.Jesse C., almost 6 years ago

          I reckon you'd be able to find a way to use CSS for it. I commend you for skipping JS too!

          1 point
          • Noureddine AzharNoureddine Azhar, almost 6 years ago

            Thanks Jesse, I actually found it to be much easier than I thought it would be. I ended up using the visibility property instead of display and then just animating the opacity.

            1 point
      • Noureddine AzharNoureddine Azhar, almost 6 years ago

        Well that was easier that I made it out to be. Added a quick fade and it seems a little less in your face now.

        1 point