Tutorials website review

[sz]

Hello,

 

this is my first project to make online... its a website about programming tutorials in general...

 

Would like some opinions about the design.

 

Thanks

 

http://www.gloore.com

[gary80]

for a first go, its pretty good. I'm not so much a fan of the green, however that just me.

 

to make it better i would add some padding, i.e. give that same amount under the search input as above it, also the part Gloore Discussions board, I would maybe increase the line height and make the text easier to read.

[sz]

for a first go, its pretty good. I'm not so much a fan of the green, however that just me.

 

to make it better i would add some padding, i.e. give that same amount under the search input as above it,

thanks for the feedback,

 

i have changed the padding of the search box and it should be ok.

 

also the part Gloore Discussions board, I would maybe increase the line height and make the text easier to read.

 

Where exactly?

[gary80]

where it says

 

'Gloore Discsussion Boards

On Gloore Discussion Boards users can share tutorials, ask questions about coding or any other related topic between our categories, suggest features, leave feedback, report bugs or talk for offtopic stuff in the offtopic section.'

 

at the top left of the front page.

 

its not so bad on my notebook, but with 1920 x 1080 is a little harder to read

 

[sz]

where it says

 

'Gloore Discsussion Boards

On Gloore Discussion Boards users can share tutorials, ask questions about coding or any other related topic between our categories, suggest features, leave feedback, report bugs or talk for offtopic stuff in the offtopic section.'

 

at the top left of the front page.

 

its not so bad on my notebook, but with 1920 x 1080 is a little harder to read

 

 

i updated it, let me know how it looks.

[gary80]

that's ideal, much easier for me to read

[1UP]

I really think you should change the whole template of the site, the green is too bright and you could make it alot more better it was more simple, simplicity is always the key to a good website.

[sz]

I really think you should change the whole template of the site, the green is too bright and you could make it alot more better it was more simple, simplicity is always the key to a good website.

 

Whats so difficult to do on the site?

 

Where is the green so bright?

 

I think its simple enough to navigate / use.

 

Thanks for the feedback.

[QuickOldCar]

For your first site, you did very well.

 

I think if anyone has anything to say about it would be opinions, the site is pretty clean and functional.

 

Now just add lots of content and good to go.

[azdrian21]

I really think you should change the whole template of the site, the green is too bright and you could make it alot more better it was more simple, simplicity is always the key to a good website.

 

i second 1UP. the user interface should be revamp.(colors and layout.The elements on the page is choke up).As the developer you may think that the website is perfect but your users will discover mistakes that might be overlooked by you. Let users be your eyes.i Don't want to be blunt here but i spend under 2 mins on the site because the site usability is poor. Have a look at dont make me think steve krug book, based on usability. 5 /10

[sz]

I really think you should change the whole template of the site, the green is too bright and you could make it alot more better it was more simple, simplicity is always the key to a good website.

 

i second 1UP. the user interface should be revamp.(colors and layout.The elements on the page is choke up).As the developer you may think that the website is perfect but your users will discover mistakes that might be overlooked by you. Let users be your eyes.i Don't want to be blunt here but i spend under 2 mins on the site because the site usability is poor. Have a look at dont make me think steve krug book, based on usability. 5 /10

 

thanks for your feedback...

Until now, i didnt have any complain about the user interface... but of course i want to improve it.

 

But i need to know whats wrong and some suggestions to make it better... revamping it everytime isnt the best idea to do.

 

So can yoo be a little more specific?

 

Thanks

[azdrian21]

 

A website should be aesthetically pleasing- IMHO your site don't possess much of that quality.

my simple phrase : "the quality of the site determines the quality of the site content".

 

The idea of the site layout is good but you're not utilizing  the space you have correctly. especially the elements on the page showing a single tutorial, are not structured properly, looking like if they struggling to breathe.

 

you may consider to :

tweak the layout

color: use a color scheme or use a color to complement the green.

 

This is just my opinion.

[amg182]

Clean, fresh and easy to use! Love it!

[KevinM1]

I think you can make a few tweaks:

 

Index page:

 

1. Make the tutorial titles bold.

 

2. Swap the tutorial author info block from the tutorial title/preview block.  Since your site is in English, which reads left-to-right, the most pertinent info should be first.  In this case, the tutorials are why people are visiting, so make it first on each row.

 

3. Instead of a generic 'View More' link at the bottom, maybe some pagination?

 

---

 

With the tutorials themselves:

 

1. Again, swap the position of the author info box and vote box with the tutorial itself.

 

2. Widen the tutorial box.  It's so tight that just about every line of code wraps.

 

3. Remove the wrap from the code boxes anyway.  For code, I'd rather it scrolled, like with Stack Overflow.

 

4. You have a ton of wasted space in the vote box.  Streamline.

 

5. You don't need two big 'G' images on the tutorial (one in the vote box, one on the tutorial itself).  Leave one, but remove the other.

 

---

 

All that said, very impressive.  Just remember that the stars of the site are the tutorials.  Do what you can to highlight them.

[sz]

I think you can make a few tweaks:

 

Index page:

 

1. Make the tutorial titles bold.

 

2. Swap the tutorial author info block from the tutorial title/preview block.  Since your site is in English, which reads left-to-right, the most pertinent info should be first.  In this case, the tutorials are why people are visiting, so make it first on each row.

 

3. Instead of a generic 'View More' link at the bottom, maybe some pagination?

 

---

 

With the tutorials themselves:

 

1. Again, swap the position of the author info box and vote box with the tutorial itself.

 

2. Widen the tutorial box.  It's so tight that just about every line of code wraps.

 

3. Remove the wrap from the code boxes anyway.  For code, I'd rather it scrolled, like with Stack Overflow.

 

4. You have a ton of wasted space in the vote box.  Streamline.

 

5. You don't need two big 'G' images on the tutorial (one in the vote box, one on the tutorial itself).  Leave one, but remove the other.

 

---

 

All that said, very impressive.  Just remember that the stars of the site are the tutorials.  Do what you can to highlight them.

 

thanks for the feedback Nightslyr.

 

I believe the View More link is better since i take the users to the page where they can browse the tutorials with filters and the first page is to show the latest ones only.

 

What do you mean with that:

Again, swap the position of the author info box and vote box with the tutorial itself.

?

 

I am thinking of re-designing the tutorial box since the space is a little small.

 

By steamlining could it work by adding the Favorite/Flag/Share/Link in the blank space between the vote buttons?

 

The 2 'G' images are the one on the left and its the users picture and one on the right which is the users thumbnail.

[KevinM1]

With my marvelous MS Paint skills, I've made a couple of rough images illustrating what I mean:

 

 

 

The black question mark boxes highlight the empty space you have in the vote box.

[sz]

That expains it better Nightslyr!

 

On the left when you are on the tutorial page, the white spaces is because of the user picture image, maximum dimensions are 200x400 thats why you see the white spaces.

 

Ill see what i can do to make it look better, will consider your thought.

 

About the user avatar in the tutorial page(on the right the 50x50 dimensions), do you think its not needed since you have this users profile information on the left?

 

Will update it soon.

Thanks for the feedback.

[KevinM1]

About the user avatar in the tutorial page(on the right the 50x50 dimensions), do you think its not needed since you have this users profile information on the left?

 

I think it should be consolidated into the user info box.  Maybe you could make the actual 'G' in Gloore stand out more.  I don't have any particular suggestions, but try playing with it a bit.

[sz]

About the user avatar in the tutorial page(on the right the 50x50 dimensions), do you think its not needed since you have this users profile information on the left?

 

I think it should be consolidated into the user info box.  Maybe you could make the actual 'G' in Gloore stand out more.  I don't have any particular suggestions, but try playing with it a bit.

 

Do you suggest changing all left boxes(userpage, tutorials page, discussion board page) from left to right aswell?

[KevinM1]

I think it's okay to leave the left-hand navigation box where it is for the discussion board.  It's in a natural place.  That said, I think the discussion box itself could be made a bit wider.  It suffers from the same smooshed problem as the tutorials.  I think I'd also make the navigation box a bit narrower, or smaller overall.

 

I can't seem to find a user page. 

[sz]

I think it's okay to leave the left-hand navigation box where it is for the discussion board.  It's in a natural place.  That said, I think the discussion box itself could be made a bit wider.  It suffers from the same smooshed problem as the tutorials.  I think I'd also make the navigation box a bit narrower, or smaller overall.

 

I can't seem to find a user page. 

 

Thansk, as user page i meant in the profile page ex. /#!/myusername

 

 

[marin123]

I think you have done a good job as it was your first on-line project. But there is a need of some more effort on the colour and header of you template.