Finally managed to get a quick responsive portfolio online.
Somewhere to blog
Have a look: roybarber.com and leave me some feedback below.
Great work, looks fantastic. Maybe freshen it up with a really subtle background gradient and get some creative text shadows going on there, maybe 2px 2px 0 rgba(0,0,0,0.1) or 0 2px 2px rgba(0,0,0,0.2)
2px 2px 0 rgba(0,0,0,0.1) or 0 2px 2px rgba(0,0,0,0.2)
@jakiestfu thanks, i feel the gradients and shadows would ruin the flat clean look, would also make the logo look a mess!
@RoyBarber I poked around.
text-shadow:0 1px 2px rgba(0,0,0,0.2);
background-image: -webkit-gradient(linear, left top, left bottom, from(#D6676B), to(#c75b5b));
background-image: -webkit-linear-gradient(top, #D6676B, #c75b5b);
background-image: -moz-linear-gradient(top, #D6676B, #c75b5b);
background-image: -o-linear-gradient(top, #D6676B, #c75b5b);
background-image: linear-gradient(to bottom, #D6676B, #c75b5b);
Still subtle but with the gradient and shadows it gives me this glowing illuminated feel. The logo is a bit more difficult to make out though. Keep up the good work!
@jakiestfu cheers :) not a big fan as i feel the flat style suits the site better, i.e icons logos etc but it is very subtle
I love it! The fresh/minimal design you were going for its on point. The only thing I find a bit off is the menu...feel like its too open. I assume it will have a hover function once implemented. Hope I made sense.
@sksquared have you resized the browser to see how the menu reacts to different screen sizes or is this now what you mean :)
@RoyBarber Brooo..I didnt know you finished the website - I thought it was a concept. Awesome! Yeah man love responsive menus - my brother got me hooked on to it recently. I like the mobile view, very clever vertically displayed under the logo.
@PeterWooster Thanks Peter, Im not to fussy about the fix, extra jScript & Loadtimes
great work ! clean and minimalist !
its great! are the icons entirely css and thats why they scale so well?
@MichalLenik the icons are svg so scale well and x2 perfectly for retina/hdpi screens with .png fallbacks
@RoyBarber very cool
How did you accomplish the subtle fade in when you first launch your site?
Everything looks great!
Yeah I'm curious how the fade was done for each page transition :)
@byandyphillips @Nightshayde Have a look at the JS/CSS, its a simple transition on load and opacity swap from 0 to 1
I must ask how on earth did you do the responsive slide effect? When resizing the page in the browser when you hit each size break the content slides to where it needs to go, how did you do that!
@Jordan4jc Hi Jordan, This is done with CSS3 Transitions on those elements. I just set a master transition on a few items/classes and it will do the nice simple effect on resize.
transition: all 400ms linear;
-moz-transition: all 400ms linear;
-webkit-transition: all 400ms linear;
-o-transition: all 400ms linear;
hope that helps!
Great work. I'd just work on the grammar of your bio. I recommend adding a comma after "Roy". Instead of "Mostly working", try "I mostly work". Then replace "as well as" with a comma. Is there a reason why you capitalized agencies, start-ups, and small businesses? Those words should not be capitalized. Last, I would change "tearing stylesheets up" to "tearing up stylesheets".
I’m Roy, a freelance designer & front end developer based in Doncaster, working across Yorkshire & Manchester. I mostly work with agencies, start-ups and small businesses. You will usually find me with Photoshop open, coding HTML5 (responsive) websites or tearing up stylesheets with CSS3/SASS.
@plowdk51 Thanks! my grammer/spelling is terrible im currently getting the site written by a copywriter anyway, but will implement those changes. Cheers :)
sorry, the only thing i feel could be better is Logo, it's my opinion, sorry if i am wrong, otherwise the whole site looks great on my RMacBook. and yes, your office is cool, i wish i would have same as yours :)
@babrah Thanks :) Looks cool on my business cards/stationary but do appriciate your feedback, Cheers!
Bootiful. Like the nice and clean look and it's just simple and does the job. One question I do have is how do you guys get these big jobs doing work for Nestle and UNICEF?
@ravravrav I'm freelance so I just get a call asking if I'm interested in working on xyz project. Usually a dribbble pro referral
@shoostar cheers :) yea no point having hover effects for touch devices :) ill have a look at that bug now, how weird!
Love it. Only thing i would change/remove is when you click a form field on OSX it gives u that crappy blue osx outline which kinda kills it, it can easily be removed by applying outline:none to the form if you didn't know :)
Forrst is a community where designers and developers can share their work and get the feedback they need. It's maintained by ZURB, a product design company that helps companies design better web sites, services and online products.
Tweet us @forrst
Email us firstname.lastname@example.org
Get monthly updates from Forrst in your inbox.
© 1998–2013 ZURB, Inc. All rights reserved.