Skip to content
View in the app

A better way to browse. Learn more.

Tip.It Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Porfolio re-imaging: SITE PREVIEW IS UP WITH DOCK

Featured Replies

I was thinking have it appear on one of the sides (and maybe move all of the content that's currently there to the other side slightly), although the bubble thing could work too.

penguin.gif

pixel avvy by me deviantART

  • Replies 75
  • Views 5.4k
  • Created
  • Last Reply

Top Posters In This Topic

I'd say definitely scanlines. And making thumbnails bigger while holding cursor on them is also a great idea.

t3aGt.png

 

So I've noticed this thread's regulars all follow similar trends.

 

RPG is constantly dealing with psycho exes.

Muggi reminds us of the joys of polygamy.

Saq is totally oblivious to how much chicks dig him.

I strike out every other week.

Kalphite wages a war against the friend zone.

Randox pretty much stays rational.

Etc, etc

 

To me, the non-scanlined one looks best, also i prefer the icons rounded. :thumbup:

skyrim_by_katri_n-d3hewko.png

no scan lines.

 

rounded icons.

 

larger text and icons.

 

also, dock effect would be nice.

 

wop wop

I've really got no experience in web design (not to be confused with graphic design), so take my opinion as more of a "web viewer". I think that the roundness of the icons is a nice touch, just make the icons less rounded than they are in the example. It should look something more like this:

 

nadrilwebround.png

 

It should be nearly square, but it's easier on the eyes to have slight roundness. Also, make sure all of the icons are equidistant, I have a feeling that's one thing that made your rounded one seem less professional than the square one (which is equidistant).

 

About scanlines, I think it's sort of good, by making the background look less boring and empty, but it's only ok if the page won't be scrolling. Never use scanlines if a page will scroll! :o

 

Otherwise, I think the scanlines would work if it's just a flash screen

 

 

 

And about convenience and accessibility, I think that the thumbnail should come up if you hover over an icon, but not immediately. It should have a bit of a delay, and the thumbnail should fade in, smoothly but quickly. Then, if the user clicks this thumbnail, it goes to the fullscreen version you mentioned.

 

As far as fonts, yes, it should be a px or two larger ::'. But I think ipkjooo's suggestion of a dynamic setup that looks good no matter what the resolution is brilliant :D :thumbup:. If you have multiple computers, or access to a public library or internet cafe, you should test the page out in those locations, on differently sized monitors. Keep in mind that, in Flash, it will actually be based off of the window size, not the actual resolution of a monitor. But setting up an interface to be dynamic in that way is definitely a huge plus :D (if you noticed in my flash RS video interface, you can't drag any of the windows off-screen, and if you move a window to the edge of the browser, then resize the browser, the windows within the application will move so that they all remain on the screen).

 

If you try to make your page's content change size relative to the size of the browser window, it will be very convenient and helpful, thus making it look more professional ::'

skillgoal99fakingunderb.png

Fake Awards:

flatawardsbox.png

(The large number is the amount of awards I have gotten; only 8 are shown above. Click to see all of them.)

  • Author

EDIT: After talking to errdoth about it I may go javascript afterall. I didn't realize how easy it was to do some of these animations in javascript but it seems better now that I look at it, for what I want to do. :thumbup:

 

 

 

I like the idea about the icons Wolfie. :thumbup: I think I'll do that.

 

 

 

 

 

As per the rest of it I'm deciding on where to put the thumbnail now. I have a few ideas:

 

 

 

 

 

1. Hovering over the icons will show a slightly larger one of it, like on the dock. It also will show the info in the chat box below. If you click it it will show a slightly larger image on the bottom of the screen (or left/right?) and if you click that you will get the full version. (Possibly with a lightbox-esque style, I'll only put the full size 1680x1050 images as a download this time, so it will fit on any monitor).

 

 

 

2. Hovering over it shows a chat balloon (or something) with the larger scale image, and the info in the chat box. Clicking on the thumbnail will activate the lightbox-esque deal, with links to full size downloads in the box.

 

 

 

 

 

Right now I'm thinking of doing #2, it seems more user friendly in general to me.

 

 

 

 

 

I'm still going to work out something new to do with the background. I might experiment with scanlines some more and I may just remove them outright but I will find a way to make the site look more visually interesting. :)

 

 

 

The good news is too I have a 1680x1050 monitor, a 1920x1200 monitor (laptop screen, only 17" though) and I can easily test it on my families 1280x1024 and 1024x768 screens too.

 

 

 

The other good news is I broke down and applied to a bunch of places here, so I think my goal is to make this site look as great as possible so I can possibly get a web design job next school year. So I have some time to get this done right. :thumbup:

It already looks amazing but here is my opinion. I dont know if they've been mentioned before but eh.

 

 

 

Scanlines: Yes but in a different kind of way, of you know what i mean. it looks tacky if you just throw them on.

 

 

 

Have the boxes rounded and also I think it would look good if when you moved your mouse over it they automatically started scrolling. That would be cool.

 

 

 

also I think you should have 2d design etc... at the very bottom because the page looks very empty. I know your going for a minimalist approach but I think that just looks better.

 

 

 

also with the images, if you hold your mouse over them for say 2 seconds they might expand to a larger size giving some basic information about it ?

 

 

 

also, another pointer, I dont like the look of it packed. it generally looks very clustered and viewers miss the point. I think what you've done is perfect.

 

 

 

also have your site adjust to any resoultion, it looks good. (in terms of professionalism)

 

 

 

with the image squares/ boxes/ i think you should only have the moving/scrolling thing if they are rounded to make it look like its "flowing"

 

 

 

yeah. i think thats it.

  • Author

Yeah a lot of that I'm planning on doing.

 

 

 

Right now I'm just sort of wracking my brain thinking of something to do to make this better. I like the layout I made (and apparently you guys do to) that doesn't need to change much, I think. However I am just trying to think what I can do as an artist to give it that little bit of something extra it needs.

 

 

 

[hide=New version]portfolio2green.png[/hide]

 

 

 

Haven't implemented the rounded thumbnails again yet, was experimenting with some other stuff. I changed the font (and upped the size to 14pt header and 12pt body) to something that I think looks a bit more professional than the standard Myriad Pro I seem to use a lot. Now the biggest challenge for me is to try and think if I need to deal with the empty space, and how to go about that.

I've never liked scanlines because when I scroll up/down on the page, they create an extremely distracting "wave" effect. Maybe it's just my monitor, I dunno.

 

Looking great so far. :thumbup:

 

 

 

Same here. If you guys don't know what he means, look at the background here, for example.

2257AD.TUMBLR.COM

"ZACKCERNYPORTFOLIO" Looked better when it was placed closer to the thumbnails in my opinion.

 

 

 

Good choice of colour, cyan is overused nowadays.

igsig.png

Hmm, I like how it's coming along. The font's much better now, and the background looks good too p12876603.gif

 

I was thinking about suggesting an auto-scroll for the icons, but I forgot to. Good idea p12882418.gif

 

I've never liked scanlines because when I scroll up/down on the page, they create an extremely distracting "wave" effect. Maybe it's just my monitor, I dunno.

 

Looking great so far. :thumbup:

 

 

 

Same here. If you guys don't know what he means, look at the background here, for example.

 

It seems like this particular page wasn't meant to scroll, and if that's the case, then the scanlines could be a nice touch. Otherwise, on scrolling pages, the moiré pattern (I think that's the proper name of the phenomenon. See here.) created by scanlines would be incredibly aggravating, and I think it would only increase the fatigue on viewers' eyes, significantly more than normal screen refresh rates do (usually the reason your eyes hurt or get tired from too much TV or computer use). Scrolling + scanlines = definite no :o

 

 

 

Although, I think I like the look of it better when it's a gradient, anyways :thumbup:

skillgoal99fakingunderb.png

Fake Awards:

flatawardsbox.png

(The large number is the amount of awards I have gotten; only 8 are shown above. Click to see all of them.)

  • Author
"ZACKCERNYPORTFOLIO" Looked better when it was placed closer to the thumbnails in my opinion.

 

 

 

Good choice of colour, cyan is overused nowadays.

 

 

 

Yeah I actually didn't mean to change it's placement, just noticed that.

 

 

 

It seems like this particular page wasn't meant to scroll, and if that's the case, then the scanlines could be a nice touch. Otherwise, on scrolling pages, the moiré pattern (I think that's the proper name of the phenomenon. See here.) created by scanlines would be incredibly aggravating, and I think it would only increase the fatigue on viewers' eyes, significantly more than normal screen refresh rates do (usually the reason your eyes hurt or get tired from too much TV or computer use). Scrolling + scanlines = definite no :o

 

 

 

Although, I think I like the look of it better when it's a gradient, anyways :thumbup:

 

 

 

You are right, this shouldn't be a scrolling site. Either way I think it looks better w/o scanlines.

Haven't read the entire thread but here's my two cents:

 

- Don't use scanlines.

 

- Go for rounded corners.

 

- Check out a Flash 3D library for a really cool but still minimal portfolio

 

- Or, use AJAX rather than Flash (check out frameworks like script.aculo.us, Dojo, MochiKit, etc)

 

- The background is dark and empty, making it look like a black hole. Maybe a subtle gradient, pattern, or even just a lighter colour?

 

 

 

It's cool, but for a portfolio I definitely think you will need more than that to really attract an employer's attention. :thumbup:

  • Author

Thanks.

 

 

 

Do you see the gradient at all ven? I might turn it up a bit or make an interesting pattern.

 

 

 

Also I'm going to be using Javascript, eredoth showed me a bunch of nice frameworks.

 

- Go for rounded corners.

 

 

 

 

 

 

What is your reasoning behind this? Just wondering ::'

2257AD.TUMBLR.COM

 

- Go for rounded corners.

 

 

 

 

 

 

What is your reasoning behind this? Just wondering ::'

 

 

 

My Reason would be that it is easier on the eyes and looks nicer...

I Support TET!| If you want bunny PM Me.|Click For My DevArt

musics.png

^ Cowboy is the Best ^

IT'S A TRAP SHINY JUST WANTS TO STALK YOU.

Hell yeah I do. Whats your msn?

That's how it all starts.

 

Next he's going to ask you what flavor of candy you enjoy and whats your favorite color van.

  • Author

Yeah I have to agree, planning on going rounded icons.

 

 

 

Tomorrow hopefully I'm going to convert it into a larger resolution image. I do wonder though:

 

 

 

Can you do the resolution scaling with javascript? I'm sure there is some script out there, and it would certainly be nice. If not I'll probably still develop for a 1680x1050 monitor first, just so that it doesn't end up looking tiny on one if I had developed for 1024x768.

 

 

 

 

 

Anyways I'm going to try and hammer out a lot of the ideas for the layout and hopefully get to coding the site by Monday at the latest. The biggest decision for me right now is what to do with the thumbnails, preview images and full size images. That is, how are they all going to work together? I'm still thinking of going the hover over route, and then when you hover over a thumbnail it will show a slightly larger preview version of the image (somewhere, not sure where yet. Any ideas?) and then if you click it it will take you to a full version if a pop up lightbox sort of deal. (I may scratch lightbox for another thing such as it however that will fit the theme of the website better).

 

 

 

 

 

With any luck the site is getting closer to being finished. I should hopefully be able to get it in a couple of weeks time. :thumbup:

I may sound some what patronising but you may be asked if you know multiple languages such as the normal HTML, CSS, PHP and then they could ask you if you know about Java and Flash. Java isn't used that much but if you want to create a good looking, interactive navigation bar for example it is HIGHLY likely they will ask for it made in Java as it much more search engine friendly.

 

 

 

I hope you're just confusing Java and Javascript...they are completly different things. Java is used more for Web Applications and games and so on, Javascript is a programming language mostly used to control objects etc. on the web...

 

 

 

I don't really have any current knowledge of flash or javascript.

 

 

 

Now given what I want to do isn't very intensive either. I think I may try and come up with a few alternative layouts as well and try out some different things.

 

 

 

I'd say you stay away from a flash portfolio to start with. I wouldn't say that a flash portfolio automatically shows you're a better Web Designer, unless it is a really advanced and innovative website. I'd recommend just sticking with a basic CSS/HTML website, using some jQuery (Lightbox (to make images pop-out into a larger box), fade in on hover and so on. You can get some great tutorials at

Java shouldn't be really used to create and design an entire website unless it has some advanced interaction with the user, or is some sort of web application, like your example... ;)

 

Not very common either.

  • Author

I already decided on Javascript Mil. :)

  • Author

Yeah I decided not to like a page back. Erdoth helped me out with some javascript links.

I'm not very good at giving advice, but..

 

-I personally prefer brighter colours, I would have done a light grey background, white "content box" and dark grey text. Since you're doing it in flash I STRONGLY recommend you play around with the layout colours, it's easy to change and it lets you optimize your design

 

-Go ROUND

 

-bigger text. When I applied for web design jobs I used a font similar to yours in my port, they called me up and asked be to make it bigger :lol: They still hired me based on the content, which proves that your art is really what matters.. don't stress too much on the portfolio design itself. Good portfolio =/= good impression.

 

-Lose the scanlines. Maybe a thick striped background, but scanlines are always an eyesore.

 

 

 

And the main reason why I posted: I wanted to tell you that I LOVE the firehydrant photo. Simply amazing <3:

hiccup.png
I'm not very good at giving advice, but..

 

-I personally prefer brighter colours, I would have done a light grey background, white "content box" and dark grey text. Since you're doing it in flash I STRONGLY recommend you play around with the layout colours, it's easy to change and it lets you optimize your design

 

-Go ROUND

 

-bigger text. When I applied for web design jobs I used a font similar to yours in my port, they called me up and asked be to make it bigger :lol: They still hired me based on the content, which proves that your art is really what matters.. don't stress too much on the portfolio design itself. Good portfolio =/= good impression.

 

-Lose the scanlines. Maybe a thick striped background, but scanlines are always an eyesore.

 

 

 

And the main reason why I posted: I wanted to tell you that I LOVE the firehydrant photo. Simply amazing <3:

 

 

 

 

 

Hes not doing it in flash anymore as far as I can comprehend :)

 

 

 

Just throwin you a heads up

  • Author

Good advice fastortoise. Yeah I made the text larger (haven't updated OP in a while) so that isn't much of an issue anymore. I'm personally a fan of dark color schemes though so I'm going to keep it like that. :)

 

 

 

You mentioned the firehydrant photo, glad you like it. I think I must have taken it like 3 years ago when I was into photography. This is the full picture if you're interested:

 

 

 

Firehydrant_3_of_3_by_Nadril.png

Create an account or sign in to comment

Important Information

By using this site, you agree to our Terms of Use.

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.