Reading mode: Light Dark

Please review my online slidetable app

Go to last post
J

JohnLindroth

Senior Member
Messages
2,907
Reaction score
549
Location
Summerville, SC, US
Hi all.

I've been working on a new cgi app for my website to display image galleries. I'm going for a "slide table" feeling.

PLEASE let me know what you think. Especially the BAD stuff.

The overall interface is there, but I'm still working on the control graphics. Also need to add code for individual image titles and will add EXIF data in the future.

Here's a link:

http://www.johnlindroth.com/slidetable.cgi?gallery=BarcelonaFavorites

If you're willing then thanks for taking the time to help me.

-John

--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
Hello John

My 2 cents.

Does not look good. There are images on both sides of big image, very bad. On large screen eyes have to move around trying to figure out what to do and brain trying to figure out how to navigate..

Succestion: Use the same method for overall layout as classic composing. Lead the viewer where you want him her to look at.

I read about a study to create a user friendly page but cannot find it for now.

Best
Aaro
--
'Simplicity is the ultimate sophistication'.



http://www.lumisoft.fi/gallery
 
Thanks Aaro,

I guess having rows on both sides didn't bother me, and since I'm writing it, I knew what to do. In thinking about it, I wouldn't do this with menus on a page. I just haven't liked much that I have seen for showing a set of small images, and a larger one to view - my goal at the moment.
thanks for the feedback
-John
Aaro said:
Hello John

My 2 cents.

Does not look good. There are images on both sides of big image, very bad. On large screen eyes have to move around trying to figure out what to do and brain trying to figure out how to navigate..

Succestion: Use the same method for overall layout as classic composing. Lead the viewer where you want him her to look at.

I read about a study to create a user friendly page but cannot find it for now.

Best
Aaro
--
'Simplicity is the ultimate sophistication'.



http://www.lumisoft.fi/gallery
Click to expand...
--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
I would suggest a few things, maybe they will work, maybe not.

1. Move the thumbnails to the right side (for most of us, clickin' monkeys)
2. Make them smaller, let say about 2/3
3. Turn that white into gray
4. Maybe make that thumbnails vertical look like a length of film
5. Cut off the long rectangles surrounding the figures (@top & bottom of page)

and, above all, don't trust graphic designers!

L
 
My 2 cents

1. First glance.. the right thumb actually stands out more than the picture itself. It's not a good sign.

2. Can you automatic center the page to fit the screen? Instead of align to the left
Use some tag and global css style can make this work.

3. The top next/previous page arrows and the page numbers do not look like 2010 style.. it looks like 80's style.
4. Needs a better banner.
That's about all I wanna say

P.S. Just looked your source code. oh man. so many tables lol
 
OK,

You ask so kindly - so I think it is not more than fair to take some minutes to review your effort. I suppose :)

And - it is my painful duty to tell you I dont like it :(

Here is a summary:

1. Its too high. Although I have a 1600x1200 screen I cannot see the entire window and still get rid of the vertical scroll bar. Using the page with a vertical scroll bar is very iirritating (to me).

2. The thumbnail row (to the left) is very distracting. It just exists there without any container - and the white backround makes the entire web page "left-heavy". Maybe a neutral gray backkround to the thumbnails would be good.

3. The two rows of coarse navigation up and down needs some visual refinement. Just a framed table inside a framed table is not enough. The two > > buttons also have to be some kind of image based buttons. Or at least they should be white with black background.

4. This is a matter of opinion - but I personally prefere if images are matted with a neutral gray matte and not black. You could use a square matte the same neutral gray color as for the thumbnails.

5. I would appreciate a line of description for each image.

6. The navigation is awkward. There should be a method for showing the next five thumbnails without moving the mouse pointer to the horisontal coarse navigators. Some > > buttons at the top and bottom of the thumbnail row? Some possibility to go to the next image would also be nice.

BTW - hope you dont get discouraged. You always have to start somewhere :)

BTW2 - I started to write that you shall look at the DPReview samle pages. But ... the new ones are a huge step backwards in aesthetic look - so ... then try to look at an older review.

--
Roland

support http://www.openraw.org/

X3F tools : http://www.proxel.se/x3f.html
 
Hi John,

It's fast - and I like that. My first impression of the controls is that they look kinda 1st gen HTML. I suggest you omit the borders on the 'Number' buttons and just use a colour, say dark grey with just a single line border.

BTW: IMO, TimesNewRoman or other serif font doesn't look good on a web site, I suggest you try a sans serif font like Arial or Trebuchet.

Just my 2 cents worth.
--
Regards,

Vitée

Capture all the light and colour!



http://www.pbase.com/vitee/galleries
 
Just some tips from a dp2 user and graphic designer.

Well. first off, the images load very fast.

I would agree with most people here on aesthetics. too much color and distraction from the images. Something like this would distract less from your images.



I also noticed that when you navigate your website, you have to move the mouse around quite a lot. An interface is always easier when you can leave your mouse in one place and click to the next images, etc. Here is a site I worked on for a photographer where the interface gives the feel of the website instead of the aesthetics. http://www.guariglia.com

Websites are really difficult, and you are doing a fantastic job.

--
corndogbrothers
http://foreigncorn.blogspot.com
 
This looks very interesting. Thanks. It's been a long time since I've done any real web programming. This is similar to what I was thinking of for the end result. Long way to go.
-John

--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
I wis I could help,but I do not have the skils to do programming at all.
However The foto side look abit od.
I use an 26 inc monitor,the structure of the info is just on the left side.
and half of my screen is empty.
However I do not have to scrol down.
Wat I was thinking why the menu bar is abouve,and on the bottem of the screen.
with is just the same bar with numbers.

The thumbs and pictures are nice but the white background on the thumbs are verry distracting.
And I feel looking more to the white background then the thumb pictures.
Meaby black or darker color.
Hope it help.
:)
JohnLindroth said:
Hi all.

I've been working on a new cgi app for my website to display image galleries. I'm going for a "slide table" feeling.

PLEASE let me know what you think. Especially the BAD stuff.

The overall interface is there, but I'm still working on the control graphics. Also need to add code for individual image titles and will add EXIF data in the future.

Here's a link:

http://www.johnlindroth.com/slidetable.cgi?gallery=BarcelonaFavorites

If you're willing then thanks for taking the time to help me.

-John

--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
Click to expand...
--
My english is poor it is checked by IESpell.
Nikon D60 Nikon D70s,Nikon D5000,Oly 420,LX3,SX10
http://demarren.smugmug.com/
Claus M
 
Thanks for all the help and feedback. First shot was about 4 hours programming time. I've worked another 4-5 today, using a lot of comments from this thread

THANKS!!!

It's still rather old-school coding, but looks much better in my opinion. Maybe I requested reviews a little too soon.

still working on: image to image updates, labels, exif, and eventual conversion to style sheets, but since I know the old stuff, it was easiest to start there.

http://www.johnlindroth.com/slidetable.cgi?gallery=BarcelonaFavorites

-John

--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
Thank you Claus,

As I worked on the page today, I saw all these things much better than yesterday - with a little help from my friends...

I just updated the script, so if you have a chance, please take another look. I'm sure there will still be a lot of empty space on your monitor, since I am formating it for a tighter working space than you have.
demarren 123 said:
I wis I could help,but I do not have the skils to do programming at all.
However The foto side look abit od.
I use an 26 inc monitor,the structure of the info is just on the left side.
and half of my screen is empty.
However I do not have to scrol down.
Click to expand...
I made the page more separated, and focused the page with a lighter background. I hope this helps.
demarren 123 said:
Wat I was thinking why the menu bar is abouve,and on the bottem of the screen.
with is just the same bar with numbers.
Click to expand...
Yes, this was a thought that did not make sense, I deleted the bottom bar.
demarren 123 said:
The thumbs and pictures are nice but the white background on the thumbs are verry distracting.
And I feel looking more to the white background then the thumb pictures.
Meaby black or darker color.
Click to expand...
Now they have a very dark, but not quite black background, to bring them out just a little from the black page background.
demarren 123 said:
Hope it help.
:)
Click to expand...
Yes it did. Thanks for the feedback.

-John
demarren 123 said:
JohnLindroth said:
Hi all.

I've been working on a new cgi app for my website to display image galleries. I'm going for a "slide table" feeling.

PLEASE let me know what you think. Especially the BAD stuff.

The overall interface is there, but I'm still working on the control graphics. Also need to add code for individual image titles and will add EXIF data in the future.

Here's a link:

http://www.johnlindroth.com/slidetable.cgi?gallery=BarcelonaFavorites

If you're willing then thanks for taking the time to help me.

-John

--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
Click to expand...
--
My english is poor it is checked by IESpell.
Nikon D60 Nikon D70s,Nikon D5000,Oly 420,LX3,SX10
http://demarren.smugmug.com/
Claus M
Click to expand...
--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
Thanks for the feedback, obviously had more issues than I initially noticed, and all the suggestions have been helpful. Thanks. Interesting website you designed. A little jumpy on my screen, but I like the ability to layout lots of thumbnails.
-John
corndogbrothers said:
Just some tips from a dp2 user and graphic designer.

Well. first off, the images load very fast.

I would agree with most people here on aesthetics. too much color and distraction from the images. Something like this would distract less from your images.



I also noticed that when you navigate your website, you have to move the mouse around quite a lot. An interface is always easier when you can leave your mouse in one place and click to the next images, etc. Here is a site I worked on for a photographer where the interface gives the feel of the website instead of the aesthetics. http://www.guariglia.com

Websites are really difficult, and you are doing a fantastic job.

--
corndogbrothers
http://foreigncorn.blogspot.com
Click to expand...
--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
Thanks L, all good suggestions. I went to the left for the thumbnails for now, but most do use the mouse in the right hand...hmmm....

-John
Escu said:
I would suggest a few things, maybe they will work, maybe not.

1. Move the thumbnails to the right side (for most of us, clickin' monkeys)
2. Make them smaller, let say about 2/3
3. Turn that white into gray
4. Maybe make that thumbnails vertical look like a length of film
5. Cut off the long rectangles surrounding the figures (@top & bottom of page)

and, above all, don't trust graphic designers!

L
Click to expand...
--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
ericlin said:
My 2 cents

1. First glance.. the right thumb actually stands out more than the picture itself. It's not a good sign.

2. Can you automatic center the page to fit the screen? Instead of align to the left
Use some tag and global css style can make this work.

3. The top next/previous page arrows and the page numbers do not look like 2010 style.. it looks like 80's style.
4. Needs a better banner.
That's about all I wanna say

P.S. Just looked your source code. oh man. so many tables lol
Click to expand...
Thanks for the feedback, very good stuff. The code was rather 80's style (or maybe 1998), but I need some education on the style sheets, and tables were a quick way to put together some 'actions'. Definitely not as easy to keep up. But I'm re-learning a lot now.

-John

--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
Thanks Roland - all good stuff. I put some pretty rough stuff out there - maybe a bit too soon. I worked some of these ideas in, and still need the better image navigation controls. Thanks for taking the time to look. I think it's getting better...

-John
Roland Karlsson said:
OK,

You ask so kindly - so I think it is not more than fair to take some minutes to review your effort. I suppose :)

And - it is my painful duty to tell you I dont like it :(

Here is a summary:

1. Its too high. Although I have a 1600x1200 screen I cannot see the entire window and still get rid of the vertical scroll bar. Using the page with a vertical scroll bar is very iirritating (to me).

2. The thumbnail row (to the left) is very distracting. It just exists there without any container - and the white backround makes the entire web page "left-heavy". Maybe a neutral gray backkround to the thumbnails would be good.

3. The two rows of coarse navigation up and down needs some visual refinement. Just a framed table inside a framed table is not enough. The two > > buttons also have to be some kind of image based buttons. Or at least they should be white with black background.

4. This is a matter of opinion - but I personally prefere if images are matted with a neutral gray matte and not black. You could use a square matte the same neutral gray color as for the thumbnails.

5. I would appreciate a line of description for each image.

6. The navigation is awkward. There should be a method for showing the next five thumbnails without moving the mouse pointer to the horisontal coarse navigators. Some > > buttons at the top and bottom of the thumbnail row? Some possibility to go to the next image would also be nice.

BTW - hope you dont get discouraged. You always have to start somewhere :)

BTW2 - I started to write that you shall look at the DPReview samle pages. But ... the new ones are a huge step backwards in aesthetic look - so ... then try to look at an older review.

--
Roland

support http://www.openraw.org/

X3F tools : http://www.proxel.se/x3f.html
Click to expand...
--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
Thanks Vitée, good suggestions. I think I should have worked another day before asking for input - I didn't put enough thought into it. But I've gotten all these great suggestions, and I think I did more today with them that I would have without. So thanks. I think it's better now...working on HTML 4 and JS and CSS now...
-John
SigmaChrome said:
Hi John,

It's fast - and I like that. My first impression of the controls is that they look kinda 1st gen HTML. I suggest you omit the borders on the 'Number' buttons and just use a colour, say dark grey with just a single line border.

BTW: IMO, TimesNewRoman or other serif font doesn't look good on a web site, I suggest you try a sans serif font like Arial or Trebuchet.

Just my 2 cents worth.
--
Regards,

Vitée

Capture all the light and colour!



http://www.pbase.com/vitee/galleries
Click to expand...
--
http://www.johnlindroth.com/gallery/
[email protected]

My future starts when I wake up every morning ...
Every day I find something creative to do with my life.
--Miles Davis
 
You must log in or register to reply here.

Keyboard shortcuts

f
Forum
m
My threads
Mobile site
About
Editorial content
Cameras & Lenses
Community
All content, design, and layout are Copyright © 1998–2025 Digital Photography Review All Rights Reserved.
Reproduction in whole or part in any form or medium without specific written permission is prohibited.
When you use DPReview links to buy products, the site may earn a commission.
©GPS Media - Guides, Products, Services.
Back
Top