SakeTami
refsheet
refsheet

patreon


Code Refactor + Character Pages (V2?)

For the longest time we've been saying that we're making some changes to the Character pages, and finally we're starting to get there.

The character pages are the oldest component in our application, and when we wrote them just over a year ago, we didn't have the same design principles and processes that we have now. Because of this, it's become near-impossible to update the Character component without breaking the site.

To combat this, we're setting a course for a bigger refactor of our front-end code, which will be rolled out slowly as the current code transitions over. The first thing we're cleaning up is the Character component and view, which will set the standard for future code.


Not so Technical:

We're revamping our character pages to be modular, which should allow you to add widges to suit your specific needs. Some key components will stay:

- Header will stay, but the Attributes table will be swappable for a simple text description.
- Color Swatches will be optional, and the layout will be adjusted to be more artist-friendly.
- "About" text will stay, this is the main profile section.

Some things will change:

- Header and Profile images will no longer be part of the gallery.
- Image Gallery will be broken up into tabs (as shown in the screenshot), with a constant "Main Gallery" and "Hidden" folder.
- Hidden images will be removed from the main gallery, and visible only in "hidden" if you're the character owner.
- The three featured images on the top of the gallery are going away, use Widgets to feature images.
- Gallery is going back to column-justification instead of row-justification. I've been very weary of making this change, but I feel it's best.

And, lastly, the big change: Modular components.

The main body of the character profile will have a number of new widgets that you can add and customize. We're still working to finalize the exact layout of these, but in general, you have a notion of Rows + Columns that you can work in.

In the image above, we have one row with three columns, the first containing a "Rich Text" widget, which is what you're familiar with editing now. The middle widget is a YouTube widget, and the right is an Image.


Quite Technical:

We're migrating from Sprockets-served Javascript to Webpack, which will give our front-end a better, more common home, and allow us to pull in some really swanky libraries.

Our website is built with Ruby on Rails, and uses ReactJS for the front-end. We <3 Coffeescript, but we're not married to it. As a whole, it is a Single Page Application using React Router to handle those requests. As a whole, this has served us well, but we're moving on.

Eventually we plan to add Redux at the top of our application, which will do a much better job handling state (especially global things like notifications, image lightboxes, authentication, etc.) Communication with the back-end will be decoupled and a dedicated API will be presented for our front-end to consume.

In all, this is a large undertaking, and we've been working out a way to bring another developer on board to get us moving. We don't have specific details yet, but you're free to contact us with inquiries.


TL;DR

Our website is getting some much needed improvements, and we're starting with a long, hard look at the Character profiles. Your feedback, developer or not, is important at this stage.

For the time being, the ONLY updates we will be focused on are those related to the character profiles. Minor bugfixes and patches might still go out, but we don't have the body count to focus on anything more.


As always, thank you for your continued support.

-- Yue

Code Refactor + Character Pages (V2?)

Comments

thanks for all your hard work on this site :)

zermit


More Creators