Dance Dance Revolution Arcades website. Seattle, Tacoma, Portland DDR and Arcade Games forum.Get New Topic Alerts
PNWBemani RSS PNWBemani on Twitter
 
Pages: [1] 2
0 Members and 1 Guest are viewing this topic.
BLueSS
September 16, 2014, 06:26:39 PM - ORIGINAL POST -

Hey everybody,

Looking at our traffic stats for this current year, 20% of visits are from mobile devices and tablets. I've been thinking about what would be the best way to easily make the site more usable on a mobile site. Most of the change will be to threads to change how the posts are displayed to try to get rid of wasted space. The following is what I'm thinking about doing first, and I wanted to see if anyone has good feedback about the suggestions.

  • DONE! Removing the repetitive subject title from every post in the thread.
  • DONE! Removing some of the space between posts.
  • DONE! Removing signatures from thread view. I don't have a new home for signatures yet (they still are visible when someone views your profile) and maybe there's a good way to customize the "user box" of each post some more. But having a signature repeat 5x on a thread adds nothing to the discussion trying to take place.
  • Moving the locations of buttons to more useful locations.
  • Reducing the size of achievements and re-vamping existing ones to allow more to take place. Having a stack of images creates a large userbox and we can make it much cleaner.

The images below show what's changed (red overlay = removed, yellow = changed) as well as mock-up of what these changes would look like live.

Unless there's good objections, I'll probably make the above changes in a month from now.

« Last Edit: October 12, 2014, 07:04:53 AM by BLueSS »

* pnw-changes.jpg (70.88 KB, 700x565 - viewed 420 times.)

* pnw-newdesign.jpg (56 KB, 828x446 - viewed 465 times.)
 
DJ Yoshitaka
Read September 16, 2014, 06:59:22 PM #1

I pretty much only visit this site on mobile so I would be pretty happy with some optimization
 
Nykkel
Read September 16, 2014, 07:21:09 PM #2

I never visit the site on mobile, but don't feel like we'd be missing out on anything with those changes.  Then again, I don't care about signatures on bulletin boards... people who do might feel differently.
 
BLueSS
Read September 17, 2014, 09:11:44 AM #3

TWO MORE CHANGES I'D LIKE TO MAKE

1 - Removing the Member "Stats" box from the left sidebar on every page. These details are visible from the bottom of the main forum in the "Info Center".

2 - Moving the "User" box from the left sidebar to a button on the top menu. Your new PM alerts and username would still be visible from that top bar.
What links do you all use from the User box that you'd like to see implemented somewhere on the site still?


Both these changes would allow the sidebar to disappear to allow the full width of the page to be used for posts, which would be allow for better use of the space on mobile devices.

« Last Edit: September 17, 2014, 09:13:31 AM by BLueSS »
 
Iori241
Read September 17, 2014, 12:05:09 PM #4

as you once said i have a friendly attitude so i'll chime in as i'm an Expert in These Matters

removing sigs is the best and friendliest option for mobile
 
Suko
Read September 17, 2014, 02:08:38 PM #5

Speaking of sigs...why did mine break?
 
BLueSS
Read September 17, 2014, 02:59:27 PM #6

Speaking of sigs...why did mine break?
I installed a signature mod to explore some options and it broke them, sorry. All you were missing was the front [img] tag so I added it back in for you.

Any thoughts about the changes proposed though?  Smiley
 
Suko
Read September 17, 2014, 03:01:21 PM #7

I'm not knowledgable about website design for mobile. Is there a way to have a mobile site while leaving this one the way it is?

Otherwise, I like all your suggestions. None of it sounded bad to me. The big problem I always have when using my phone is the small font size and the important buttons you want to click are pretty small too. So, that's something I can chime in on.
 
BLueSS
Read September 17, 2014, 03:18:22 PM #8

I'm not knowledgable about website design for mobile. Is there a way to have a mobile site while leaving this one the way it is?

For many sites, yes there are several ways of doing that. For a hobby site that doesn't have any mobile optimization build into the forum system already, it would take a lot of work to implement most of the options. Simple Machine Forums version 1 (what this site is running) came out before "responsive" website design was even a thing. That's the common way of doing mobile; where you have CSS that hides/shows elements of the page based on the website detecting your screen size.

This url is a good example of responsive layouts for anyone unfamiliar.
http://css-tricks.com/resolution-specific-stylesheets/
Open the webpage in a windowed browser and resize the window noticing how the layout of the page changes.

The easiest way for me to make it mobile friendly is to (1) make the layout of the site cleaner for all devices and then (2) try to make it be a partially responsive based site (like the linked example above).

Quote
Otherwise, I like all your suggestions. None of it sounded bad to me. The big problem I always have when using my phone is the small font size and the important buttons you want to click are pretty small too. So, that's something I can chime in on.

I hope to fix both of those problems! Smiley  

« Last Edit: September 17, 2014, 03:22:12 PM by BLueSS »
 
Suko
Read September 18, 2014, 12:12:29 AM #9

Actually, one last suggestion. And this applies to normal and mobile browsing.

I'd like a giant button (under my avatar or somewhere) that allows me to see all the latest posts since I was last here. I know there's the "Show Unread" link, but again, it's tiny and hard to hit on my phone. I'd prefer a nice large button that's easy to see and easier to click.
 
BLueSS
Read October 11, 2014, 10:33:44 PM #10

I just implemented the first set of changes:
1) Signatures Disabled
2) Thread titles removed from each post and Post Time plus Unread icon moved into it's old location.
3) Removed space between posts
4) Changed "Reply" "New Topic" buttons to match other button style

Please give any feedback you have. Smiley

« Last Edit: October 12, 2014, 07:05:29 AM by BLueSS »
 
BLueSS
Read October 14, 2014, 09:05:54 PM #11

Small change today to top menu bar: Grouped "site links" together on the left and "user account" links on the right.

Any feedback about the changes here?  Smiley  I'll take the silence to mean they're all ok so far.
 
Suko
Read October 15, 2014, 10:29:12 AM #12

I haven't used mobile on the site since any of these changes occurred, but so far they seem to be mostly unobtrusive changes that I didn't notice. (That's a good thing).
 
BLueSS
Read October 15, 2014, 11:05:51 AM #13

The bulk of the mobile optimizing is after the interface changes I've been doing the past few days. That's still coming, so don't expect big improvement there yet. Smiley
 
BLueSS
Read July 21, 2015, 03:23:17 PM #14

2 - Moving the "User" box from the left sidebar to a button on the top menu. Your new PM alerts and username would still be visible from that top bar.
What links do you all use from the User box that you'd like to see implemented somewhere on the site still?
Well, I made this change today.  Let me know what you think.
 
Suko
Read July 22, 2015, 09:42:07 PM #15

I found myself using the "Unread Posts" link in the user box. Same with the PM button. I see the PM button at the top right now. I assume it will change if there's an unread PM? But where's the Unread Posts link gone to?

« Last Edit: July 22, 2015, 09:48:38 PM by Suko »
 
BLueSS
Read July 24, 2015, 10:44:35 AM #16

I found myself using the "Unread Posts" link in the user box. Same with the PM button. I see the PM button at the top right now. I assume it will change if there's an unread PM?
Yes, it will show a number next to "PM" if you have a PM.  I just sent you a PM so you can see it. Smiley

But where's the Unread Posts link gone to?
I just added an "Unread" button to the left of PMs when you are logged in. Scott, this was the link you were using?
 
Suko
Read July 25, 2015, 12:16:15 AM #17

Yep. Thanks! =D
 
BLueSS
Read July 27, 2015, 10:05:42 PM #18

Alright, I worked for 5 hours tonight to try to make the site mobile-friendly.
I know some things are a bit broken on mobile still (bottom content on front page, registration, and login for example).  If you see things that are broken on mobile, post here and I'll try to get them resolved! 

(Note, on smaller screens the twitter/rss and search are intentionally hidden. Same with the bottom menus, because I figure nobody uses those.)
 
Davyn
Read July 27, 2015, 10:20:23 PM #19

Reading posts looks good, but viewing the forum itself is really messed up for me. iPhone 6. I took a couple screenshots http://imgur.com/a/YwvBg
 
BLueSS
Read July 28, 2015, 10:29:44 AM #20

Reading posts looks good, but viewing the forum itself is really messed up for me. iPhone 6. I took a couple screenshots http://imgur.com/a/YwvBg

Thanks, Davyn.  Forum category viewing is bad for me too, so I'll try to take a look at that here soon.  As a workaround, landscape mode on the phone seems to get rid of all those pesky issues.
 
BLueSS
Read July 29, 2015, 08:08:20 AM #21

Small update: Registration and Login pages look good on mobile.
 
BLueSS
Read July 29, 2015, 07:20:40 PM #22

HUGE UPDATE: Most of the functionality of the site is now mobile friendly.

Please take it for a test drive and let me know how she handles.
 
Suko
Read July 30, 2015, 02:15:03 PM #23

One issue: The block pop-up boxes on the right tend to obscure all the links in the top right of the page.

 
BLueSS
Read July 31, 2015, 03:08:23 PM #24

I just turned off those notifications. I take it that everything else must be good, although forum activity has been low the past week or so.
 
 
Pages: [1] 2
 
Jump to: