RolePlay onLine RPoL Logo

, welcome to RPoL Development

09:52, 16th April 2024 (GMT+0)

New site design.

Posted by jase
DarkLightHitomi
member, 1396 posts
Mon 30 Jul 2018
at 23:12
  • msg #134

RPoL Design Update

The spoiler thing came up before, and if I recall correctly, the current method used is done to avoid using scripts and things that older browsers and slow connections don't like.

As for the new site, google actively (or will in the future) prevents non-responsive sites from showing up on the first page of search results, thus, jase needs a responsive site in order for new people to find rpol (cause seriously, how many people look through multiple pages of search results?).

Though personally, while not perfect, I have not seen another site that even challanges rpol for my favorite site design, speaking of the old rpol not the new one.
LordXenophon
member, 16 posts
Tue 31 Jul 2018
at 01:52
  • msg #135

RPoL Design Update

Well, I'm using IE7 and I have about the slowest connection that will even work any more, so anything that bad would hit me first and hardest.

But in the NationStates forums, I can load a page full of those spoiler tags, with all of them working just fine, just as fast as I load pages on RPoL. If it's a script, it's a small and well written one. I think it's really just a standard BB code they have. But whatever it is, I'm reasonably sure it could be used here, without slowing me down.

Hotmail, on the other hand, won't even load any more. If I'm lucky, I get a page of red x's. Most of the time, I get a script error or the "cannot display this page" screen, after up to 20 minutes of waiting. Whatever it is that they did in their last redesign, I would hold them up as an example of what I want RPoL NOT to do during this redesign.
TookyG
member, 90 posts
Tue 31 Jul 2018
at 02:27
  • msg #136

RPoL Design Update

In reply to LordXenophon (msg # 135):

Windows XP?  I think the Maxthon browser still has XP support.
DarkLightHitomi
member, 1398 posts
Tue 31 Jul 2018
at 03:55
  • msg #137

RPoL Design Update

IE7 is more modern than some people. Some folks might even still be stuck with only pure html webpages.

Also, the connection is just one piece. The new rpol site server isn't noticeably slower for creating and sending a webpage than for the old website, but my computer certainly notices.

My phone is even worse. It can play the android Baldur's gate II, yet it can't handle even google docs pages that has become the standard way of sharing maps on other maps on other sites.
jaws78
member, 16 posts
To err Is human ...
... to role play divine.
Mon 3 Sep 2018
at 08:49
  • msg #138

RPoL Design Update

In reply to DarkLightHitomi (msg # 137):

After server move, responsive site, new post Icon is broken.
Skald
moderator, 828 posts
Whatever it is,
I'm against it
Sun 30 Sep 2018
at 04:43
  • msg #139

RPoL Design Update

Looks like the user sign up date that was relatively recently added is no longer showing on the user profile on the responsive site.  :<
Utsukushi
member, 1460 posts
I should really stay out
of this, I know...but...
Sun 30 Sep 2018
at 05:04
  • msg #140

RPoL Design Update

That's because the even newer "Make BBR Look Like A Liar" mod I proposed is working perfectly!

...Hm?  That's not it?  My proposal is still in the fireplace, and in fact, on fire?  Oh.  Probably shouldn't have mentioned it, then.  You don't suppose he reads this forum, do you?
Skald
moderator, 829 posts
Whatever it is,
I'm against it
Mon 1 Oct 2018
at 14:04
  • msg #141

RPoL Design Update

Aannd ... the user sign up date does still appear to be on the test version on the Beta site - might have just been wishful thinking that it'd been released in the Responsive version proper.  :>
jase
admin, 3618 posts
Cogito, ergo procuro.
Carpe stultus!
Thu 13 Jun 2019
at 12:24

RPoL Design Update

Have done a few updates to the responsive site.

While the responsive site may be aesthetically challenging everything should work, at this stage I am avoiding changing anything besides the actual HTML output.. though no guarantee I'll get that right.

Biggest change is that the die roller has been updated to responsive.  Not sure why I picked that one but when I checked CodePen it seems that is what I was messing with some time ago, so I finished it off.

For those who do persevere with the responsive site, or at least use it intermittently, please let me know what you'd like updated next (anything but the GM menu, I think that'll be very last), I'll aim to do whatever's bothering you the most.

Signup date is on the responsive page, btw.
jase
admin, 3621 posts
Cogito, ergo procuro.
Carpe stultus!
Sat 15 Jun 2019
at 15:42

RPoL Design Update

Updated a few more pieces of the responsive site.  rMail and private thread lists should be laid out little better and various post links/buttons should appear at the bottom of the page where appropriate (annoying scrolling to the bottom and then to go back to the top to reply).

Previewing a message should also be better.

Just a bunch of aesthetic and usability improvements today (usual disclaimer, hopefully nothing broke!).  Went to do the rMail thread list only to realise I'd already done it (yay) so went to the private list... also done (double yay!).  Gotta figure which page to tackle next!

Edit:  CSS has been updated, Chrome cached the darn thing even though I'd updated it (and it knew it too!).  Might have to force refresh to see the changes.  Biggest issue I saw was the missing "Post a Reply" button at the bottom of a thread.
This message was last edited by the user at 15:44, Sat 15 June 2019.
LonePaladin
member, 828 posts
Creator of HeroForge
Sun 16 Jun 2019
at 04:12
  • msg #144

RPoL Design Update

Any reason why the color scheme won't change? I've been using Dark Purple for so long my brain simply associates that color pattern with the site, so the plain look of the responsive site just doesn't look right to me.
jase
admin, 3622 posts
Cogito, ergo procuro.
Carpe stultus!
Sun 16 Jun 2019
at 04:37

RPoL Design Update

Single theme at the moment, all themes will have to be redone once the responsive site is no longer a moving target.
jase
admin, 3624 posts
Cogito, ergo procuro.
Carpe stultus!
Sun 23 Jun 2019
at 14:18

RPoL Design Update

In lieu of feedback of any sort I've updated the "white" (default) theme to support the creation of custom themes.  You can now go into your preferences and create a theme for the responsive site.  The old site will still have your current settings if you want to use that as a basis.

((As an aside this involved changing the way the entire theme was calculated, I no longer use a separate template file but use the default css file as the template which means any changes I make to that are automatically applied to any themes based upon it.  Additionally all custom themes will be identical in structure to the master file which means that if people reckon they've created the perfect theme it can be suggested that it's cloned to become one of our available options!))

Note that the list of colours is currently very long, there's a stack of other styles now and also the css hasn't been optimised as of yet (two (or more) settings that should have the same colour might be listed separately).  I also think there's a few colours defined outside of the theme which will need cleaning up/moving over.

The new css also has gradients, shading and opaque settings which complicate things even more, but I think the layout makes it pretty simple except for the fact that it's just a much longer list.

I've also fixed a bunch of other aesthetic things while I was going about it (and, to harp on the point, having no other feedback to go on).  CSS updates should be automatically loaded but if in doubt force a refresh on your browser.
nauthiz
supporter, 603 posts
Mon 24 Jun 2019
at 05:39
  • msg #147

RPoL Design Update

Since June 13th I've started using the responsive site exclusively when interacting with RPoL on my phone.  Below are some notes I've kept regarding the user experience.

All experiences were had on a device running Android 7.0 (Nougat) and using Chrome 75.0.3770.101.  Any "bugs" or other unexpected behaviors were verified on the same device in Firefox 67.0.3.

---

The Main Menu drop down does not work as a user probably might expect, especially based on a touch screen friendly design.  Based on the initial button interaction a user will likely expect that touching the blank space on the list to the right of the words will trigger the expected behavior, it does not.  A user must press each individual word like an old fashioned hyperlink.  This issue is further compounded by the other navigation drop downs which are fully responsive across the entire horizontal width of the drop down menus

---

On the compose messages screen the "private to" checkboxes extend "off screen" when composing a message.  A user can access then by scrolling the screen right if they realize that's an option

---

The position and size of the remove game minus signs make them very difficult to interact with due to their small size and placement against the right side of the website margin.  While this may be a specific decision to prevent accidental interaction, even when zooming in to intentionally use them the right side justification makes them very difficult to use since they remain on the right edge of a device's screen.  Adding some space between them and the right border of the site, even just an amount equal to the width of the button itself, would help this issue.

---

Game map functionality doesn't seem to be working correctly in all cases.  I have two games which do not have a "main game map" but instead have a map assigned to a specific group.  Attempting to view that map via the "select another map to view" menu does not work correctly.

In both cases it causes the site to send you to the "RPoL Announcements" forum, as indicated by the "Welcome to" text beneath the RPoL logo, and gives you an error.

quote:
This is not a game

"RPoL Announcements" is not a game.

Game information is (logically enough) only available for games.


I do not have any games that actually do have a "main game map" uploaded so I was unable to test whether that altered this particular issue or not.

---

Nomenclature.  On the old site the page you see when you're logged in and visit RPoL is called the "main menu" according to all the site's navigation links.  On the responsive site the drop down navigation list is labeled main menu and now "home" is used for that same page.  However there's still other navigation options, like the links at the bottom of pages, which are labeled "main" when they should probably be labeled "Home" to follow the naming structure of the responsive site.

---

The dice roller doesn't work.  Changing dice options, inputting manual rolls, all seem to be behaving normally.  However no amount of touching or tapping the "Roll the Dice" button actually triggers the expected page behavior and generates a dice roll.
jase
admin, 3625 posts
Cogito, ergo procuro.
Carpe stultus!
Mon 24 Jun 2019
at 12:43

RPoL Design Update

Wow, awesome thanks nauthiz.

Main menu drop down - Had never even noticed!  Was ready for a battle to get this to work but it was a simple "display: block" for the hyperlink, so... fixed.

Private to list - Had been ignoring that one.  Should be better now.  Colouring/spacing needs tweaking, but so does most everything!

Game removal minus sign - Not sure how that one needs to be fixed, have been ignoring it.  Will ponder and procrastinate in the hope someone else will come up with a solution.  (c;

Maps - Fixed thanks.  Was a wider problem so glad you spotted that one.

Main Menu vs Home - Haven't decided what's the best way to go.  Home is more commonly used, main menu is what we've used for ages.  Can standardise on either (or something else entirely).
nauthiz
supporter, 604 posts
Mon 24 Jun 2019
at 19:12
  • msg #149

Re: RPoL Design Update

jase:
Game removal minus sign - Not sure how that one needs to be fixed, have been ignoring it.  Will ponder and procrastinate in the hope someone else will come up with a solution.  (c;


If this was a document I'd assume that minus sign image was "aligned right" and just needed someone to put the cursor to the right of it and press the space key a few times give it some white space between itself and the right margin, which would solve the issue.

If that's actually harder to do because of web coding reasons, since the minus sign is just a 7x7 image, if you added 7 or 14 pixels of transparency to the right side of it, it should make the graphic big enough to more easily interact with without changing its appearance and (presumably) not having to actually change anything but the image file itself.
MalaeDezeld
member, 111 posts
Mon 24 Jun 2019
at 19:47
  • msg #150

Re: RPoL Design Update

Maybe something in the game menu instead? But not nearby the "Mark all as Read".
jase
admin, 3626 posts
Cogito, ergo procuro.
Carpe stultus!
Tue 25 Jun 2019
at 00:51

Re: RPoL Design Update

I was wondering whether the whole process of automatically adding games to the list needed to be revised.  Replace it with a notification at the top of the game asking if they want to add it to their watch list (which could possibly have a few options as people have asked of ways of separating different games on the main menu).

Depends whether it's more annoying to have to remove games from your list when just browsing around or it'd end up being more annoying to constantly have to add games to your watch list.

As for the minus sign -- adding white space to the actual would work but will have issues as it's then a white image that can cause wrap issues.  Actually, as the blank area would be part of the image then it'd also be part of the hyperlink, so more potential for miss-clicking.  It'd also be best if they were all lined up like on the current site.

I'd actually thought about moving it to the user preferences screen.  Add a link on the main menu (under the "main menu" menu section) to manage the games.
DarkLightHitomi
member, 1573 posts
Tue 25 Jun 2019
at 02:50
  • msg #152

Re: RPoL Design Update

On adding vs removing games,

I find removing games from a sticky list is many times better. I can't tell you how often I forget to "subscribe" to a thread before navigating away and then can't find the thread again. Removing from a sticky list doesn't have that problem.

That said, I don't find the issue nearly as big a problem on rpol as on other sites. In fact, rpol is the only site I've been on where I need to remove more than I wanted to add.
jase
admin, 3627 posts
Cogito, ergo procuro.
Carpe stultus!
Tue 25 Jun 2019
at 03:00

Re: RPoL Design Update

I think having to remember to remove is better than having to remember to add.  No real issue if you forget to remove (and it's pretty hard to).  Opposite when you have to add.

Unless others disagree then it's just a case of do we need a removal link on the main menu along with the clutter it brings or can we move it to another page?
nauthiz
supporter, 605 posts
Tue 25 Jun 2019
at 06:58
  • msg #154

Re: RPoL Design Update

I think the functionality as is, is the best way to go.  It's also more intuitive to teach a new user how to remove games, than how to add them.

Also, just to illustrate the concept.  I don't think the button needs to be enlarged significantly.

I think something like this

https://www.dropbox.com/s/xgw8.../minus_wide.gif?dl=0

would be more than sufficient to make it more accessible on a smaller touch interface, like a smartphone, without making it so huge people might accidentally remove a game they don't mean to while just trying to scroll the page.
jase
admin, 3628 posts
Cogito, ergo procuro.
Carpe stultus!
Tue 25 Jun 2019
at 09:18

Re: RPoL Design Update

At a glance having a wide image will fix some stuff but I think it'll end up oddly aligned.  Also as mentioned the whole image would be the hyperlink which will mean blank area will be a clickable area, plus it'll mean wrapping has to compensate for the entire length.

I think we can do the same with image alignment, padding and margin.
Skald
moderator, 849 posts
Whatever it is,
I'm against it
Sat 29 Jun 2019
at 04:38

Re: RPoL Design Update

I'd like to see the functionality moved to the preference screen - its more intuitive to keep all that kinda stuff in the one place.  But definitely automatically add and manually remove.

Looking at the responsive site on a desktop, there's a nice empty third of the screen to the right where that could sit - I'm imagining a scrollable list of games, with a single checkbox next to each - if checked it shows on the main screen, if not checked it doesn't.
jase
admin, 3629 posts
Cogito, ergo procuro.
Carpe stultus!
Sun 30 Jun 2019
at 07:59

Re: RPoL Design Update

It'll still be there under the user preferences but if we can keep it on the main menu then I guess why not.  I've tweaked the plus/minus symbol on the main menu, should flow nicely now.  Image probably still needs to be a little larger, but not much.  I generally have to enlarge the screen to be able to click the minus but I think that's mostly a good thing.

Bunch of other things I've messed with, so much I've generally forgotten.

The one obvious change is I've made the colouring a little less like candy for the header/footer/bars.  Will let that sit for a while and see how it goes.
nauthiz
subscriber, 606 posts
Sun 30 Jun 2019
at 08:35
  • msg #158

Re: RPoL Design Update

The symbol is way easier to actually interact with now on a mobile device.  Still have to zoom in, which I think is a good feature rather than a bug, but it's not right up against the side bezel now, so it's much easier to use it if you need it.
Sign In