User's Perspective Improvements

[aeggum]

Making this into it's own issue to prevent issues having many sub-issues.

what else do you guys think should be done to improve this iterations features, from the user`s perspective?

List of things that can be improved/changed, perhaps: 1. Less clutter on the search results page 2. Search results page table entries could be links (like the admin page's table) 3. 'Pagination' on the search results page

4. Change display of true/false output to be yes/no, throughout the site
5. Flagging should only be available to do once per listing page. (this one will be more tricky) 6. Change the look of the flag area. Can you make a button larger? Otherwise, make it less obtrusive, at least with coloring, perhaps? 7. Make the Search bar consistent with current search parameters in a way that if a criteria has been set, then the respective criteria box is automatically dropped out when the page is loaded again, so that the user can keep track of which criterias he has inserted or not. 8. Solve the website shifting problem (because the right scrollbar appears and desappears depending on the search panel height) Found a solution that might not always work 9. Enhance styling of default elements such as the default appearance of text input boxes Only for the search bar, yet
6. On the Listing page, change "Type (House (true) or Apt (false)):" to a more human-readable form such as simply "apartment" or "house"
7. After clicking on Clear Search criteria, make a slight scrolling all the way to the top instead of going instantly! Guilherme: I have an idea on how to do that with JavaScript 12. Change the navigation links above the results table so that they are initially yellow and are white when hovered over (just use the "generic_link" class on the tags for them - I couldn't find these tags...) - Cory

(feel free to add any more by editing this if anything comes up!)

[guilhermesgb]

I'm currently tackling 1 and 2.

If I think of more things that would make user experience better I will post here.

Edit: I closed the issue by mistake and reopened again.. sorry

[guilhermesgb]

I did some significant changes on the table; Now I'd say that items 1 and 2 are resolved. Say what you think about it now, maybe I did not pick the best combination of colors to make it as easy to read as possible, without annoying the user.

So, now I try with 5 and 6, the flag button/area issues.

[aeggum]

I just pulled the changes to my local copy, are the search results links? From what I can tell, they aren't..am I missing something?

[guilhermesgb]

I did not change them to be links, but gave them the behavior of a link via Javascript. I'm not sure if that is what you mean, though..

About the item 6, I changed the button appearance, now it looks a bit better. Should I change the color of the background from grey to something else, though?

[guilhermesgb]

I also standardized it so all buttons now look the same. If there is any that maybe is not that good, e.g. the Submit Criteria button, we can change it. I'm thinking on putting some transition effect on the text inside the button, maybe turning into orange, to match with the site's theme.

[aeggum]

I'm not sure on the styling stuff, but I've noticed that with the search results page changes, there's no way to get to a listing page, unless I'm mistaken.

The results need to either be a link (to the specific listing page) or the show button should still be there.

[guilhermesgb]

That's strange, here it is working just fine. Is javascript enabled in your browser? Maybe that is the case.

Here, if I click in one entry, I'm redirected to the specific listing page that I clicked into.

[aeggum]

Strange indeed..it works in Chrome on my machine, but not Firefox. Not sure what could be causing that. Nice work on it though (at least for Chrome!), it's a lot better now.

[guilhermesgb]

Thanks! Well, I have no idea why there is this difference on Firefox, I'll try to asses that.

edit: Yeah, I just saw it now in Firefox, it is really weird!

[guilhermesgb]

Just finished item 7 that I raised earlier. I couldn't find a solution for item 5.

I did not try 4 and 3 but I think they should be easy to do, I'll try more later. I'm not going to the classes today as I'm heading to the STEM Fair from 1pm to 4pm. After that I'll return back to work. I'll have a fast meeting at 5pm but that should not take long, and we have until 11pm to wrap everything up.

I wish github had a section where one could post something like this (my plans for next time spent working) because I know here is not the best place.

[aeggum]

Thanks man, I did think of # 7 earlier but had forgotten about it, that would be pretty nice. Nice work!

As for 3, the easiest way may be to use the 'pagination' gem that is already used on the admin page (info on the readme on github). As long as it doesn't break the searching, it shouldn't be too tough.

4 may be a bit more tricky, may have to add some helper methods or do some things in the controller to deal with it.

[guilhermesgb]

I noticed that Firefox is not properly executing this Javascript code:

window.setTimeout(500); location.assign("/lists/"+id);

at application.js:setSelectedTableElement();

That is why the page is not redirected... I'll investigate on why is this happening!

[guilhermesgb]

I found a way of solving that.

Now, about the 4 and 5, I don't think that we in the front-end will be able to solve that.. I will try finding more stuff to do to improve user experience.

[aeggum]

Sweet, that sounds great!

[guilhermesgb]

I've done some more styling on the Search bar. It looks better now.

I've noticed that that issue with the scroll bar on the right can get really annoying with times. (The fact that it keeps appearing and disappearing depending on the search bar size, so the entire site keeps shifting back and forth). I was thinking that one way to solve this is to have the bar there all the time. What do you guys think?

[guilhermesgb]

I found a very easy way to make the scrollbar always appear: I just made the search panel a little bit higher, enough so that the scroll bar appears. That might not work for different resolutions, though. Maybe not even for you guys.

[aeggum]

If you can make it be there all the time, that would be great, I think. Yeah, doing something like that might work but is completely resolution dependent. I'm wondering if there is someway to get it to show up in all cases.

[cromdenne]

Hey Guilherme, I've been working on animations for the search panel (I figured out a really easy way to do it). I've been looking at this site:

http://script.aculo.us/

and more specifically, this page:

http://madrobby.github.com/scriptaculous/combination-effects-demo/

This whole library is already included in our ruby project from the start, so I started implementing one of the animations. It might conflict with some of the things that you added for the search panel, but it should be simple CSS to add back whatever is needed.

I'm almost done with the animations (and I cleaned up the CSS for the search panel a bit), so I'll push when I'm done. It might break the "Clear Search Criteria" temporarily though – I renamed a lot of the elements to simplify things.

[guilhermesgb]

Adam, yeah, I'll make a better search on how to make the search bar display automatically. There should be an easy way to do that and it would solve our problem for all resolutions.

Cory, that is amazing! No problem, if something breaks, I can fix it later. I'm thinking about a nice way to style the Listing pages right now.

2012/4/14 cromdenne11 < reply@reply.github.com

Hey Guilherme, I've been working on animations for the search panel (I figured out a really easy way to do it). I've been looking at this site:

http://script.aculo.us/

and more specifically, this page:

http://madrobby.github.com/scriptaculous/combination-effects-demo/

This whole library is already included in our ruby project from the start, so I started implementing one of the animations. It might conflict with some of the things that you added for the search panel, but it should be simple CSS to add back whatever is needed.

I'm almost done with the animations (and I cleaned up the CSS for the search panel a bit), so I'll push when I'm done. It might break the "Clear Search Criteria" temporarily though – I renamed a lot of the elements to simplify things.

---

Reply to this email directly or view it on GitHub:

https://github.com/mswysocki/Madison-Student-Apartment-Finder/issues/14#issuecomment-5128680

Guilherme Santos Galvão Baptista UW-Madison Exchange Student - CS Major UFCG Undergraduate Student - CS Major LSD (Distributed Systems Laboratory) Former Scholar OurGrid Former Developer

[guilhermesgb]

I looked at the demo effects, they sound really nice! =D

2012/4/14 Guilherme Santos guisgb13@gmail.com

Adam, yeah, I'll make a better search on how to make the search bar display automatically. There should be an easy way to do that and it would solve our problem for all resolutions.

Cory, that is amazing! No problem, if something breaks, I can fix it later. I'm thinking about a nice way to style the Listing pages right now.

2012/4/14 cromdenne11 < reply@reply.github.com

Hey Guilherme, I've been working on animations for the search panel (I figured out a really easy way to do it). I've been looking at this site:

http://script.aculo.us/

and more specifically, this page:

http://madrobby.github.com/scriptaculous/combination-effects-demo/

This whole library is already included in our ruby project from the start, so I started implementing one of the animations. It might conflict with some of the things that you added for the search panel, but it should be simple CSS to add back whatever is needed.

I'm almost done with the animations (and I cleaned up the CSS for the search panel a bit), so I'll push when I'm done. It might break the "Clear Search Criteria" temporarily though – I renamed a lot of the elements to simplify things.

---

Reply to this email directly or view it on GitHub:

https://github.com/mswysocki/Madison-Student-Apartment-Finder/issues/14#issuecomment-5128680

Guilherme Santos Galvão Baptista UW-Madison Exchange Student - CS Major UFCG Undergraduate Student - CS Major LSD (Distributed Systems Laboratory) Former Scholar OurGrid Former Developer

Guilherme Santos Galvão Baptista UW-Madison Exchange Student - CS Major UFCG Undergraduate Student - CS Major LSD (Distributed Systems Laboratory) Former Scholar OurGrid Former Developer

[cromdenne]

Ok, I just pushed my changes to live site, so you can take a look. It made the search panel a bit larger in terms of height, and I changed the hover effect so that it included the whole partition instead of just the word when you hover (and now you can click anywhere on the section for the word, rather than just on the word itself).

I was considering adding an

---

tag for each drop-down menu to separate the title from the options, but I didn't want to add a generic one like the rest of the search panel had, otherwise it would be too cluttered. I couldn't figure out how to style it properly, so I just left that part out. But I think the animations are good (or are at least a good starting point).

[cromdenne]

Oops, it actually added a ruler when I typed in an hr tag! So that was supposed to be an "hr" tag, not an actual line.

[aeggum]

I like the changes quite a bit. Pretty sweet! It's a lot easier to click and get the search field that you want to drop down. I would imagine for smartphone or tablet users it would be quite a bit better just because it's easier to click a field.

The problem with the page shifting left/right still happens but isn't as noticeable now because of the transitions and larger size. Still happens on a high resolution screen though.

[guilhermesgb]

Man It looks amazing! That is exactly what we meant for starters! I really like that, congrats!

2012/4/14 cromdenne11 < reply@reply.github.com

Oops, it actually added a ruler when I typed in an hr tag! So that was supposed to be an "hr" tag, not an actual line.

---

Reply to this email directly or view it on GitHub:

https://github.com/mswysocki/Madison-Student-Apartment-Finder/issues/14#issuecomment-5128933

Guilherme Santos Galvão Baptista UW-Madison Exchange Student - CS Major UFCG Undergraduate Student - CS Major LSD (Distributed Systems Laboratory) Former Scholar OurGrid Former Developer

[guilhermesgb]

Yeah, I think we will have to specifically set somehow the scrollbar to always be there. I could do it with frames, there should be an easy way for the "root" document as well.

2012/4/14 Adam Eggum < reply@reply.github.com

I like the changes quite a bit. Pretty sweet! It's a lot easier to click and get the search field that you want to drop down. I would imagine for smartphone or tablet users it would be quite a bit better just because it's easier to click a field.

The problem with the page shifting left/right still happens but isn't as noticeable now because of the transitions and larger size. Still happens on a high resolution screen though.

---

Reply to this email directly or view it on GitHub:

https://github.com/mswysocki/Madison-Student-Apartment-Finder/issues/14#issuecomment-5129016

Guilherme Santos Galvão Baptista UW-Madison Exchange Student - CS Major UFCG Undergraduate Student - CS Major LSD (Distributed Systems Laboratory) Former Scholar OurGrid Former Developer

[aeggum]

I added the pagination to the search results page, looks to be working just fine.

The only other thing for that would be to style the links and stuff so that they look decent/go along with site style. There is a css fiie already made with some default paging styles you could try to get an idea. (pagination.css)

[guilhermesgb]

Nice! Which links do you mean, the listing entry itself of links inside each entry?

2012/4/14 Adam Eggum < reply@reply.github.com

I added the pagination to the search results page, looks to be working just fine.

The only other thing for that would be to style the links and stuff so that they look decent/go along with site style. There is a css fiie already made with some default paging styles you could try to get an idea. (pagination.css)

---

Reply to this email directly or view it on GitHub:

https://github.com/mswysocki/Madison-Student-Apartment-Finder/issues/14#issuecomment-5129268

Guilherme Santos Galvão Baptista UW-Madison Exchange Student - CS Major UFCG Undergraduate Student - CS Major LSD (Distributed Systems Laboratory) Former Scholar OurGrid Former Developer

[aeggum]

No, like the 1, 2, 3, 4..etc. Page links just above the results table.

[guilhermesgb]

Nice, I saw them now. I think that 4 is a good number of results per page, will fit nicely with the search bar criterias all slided up. What do you think? Maybe we can have this to be customizable by the users later, anyways.

2012/4/14 Adam Eggum < reply@reply.github.com

No, like the 1, 2, 3, 4..etc. Page links just above the results table.

---

Reply to this email directly or view it on GitHub:

https://github.com/mswysocki/Madison-Student-Apartment-Finder/issues/14#issuecomment-5129319

Guilherme Santos Galvão Baptista UW-Madison Exchange Student - CS Major UFCG Undergraduate Student - CS Major LSD (Distributed Systems Laboratory) Former Scholar OurGrid Former Developer