CSESoc Website 2021

note: this is a repost of the content on our ideas figma ->https://www.figma.com/file/KlRQuhpCyzU0qFra2EbzwU/CSESoc-Website-ideas-and-brief?node-id=0%3A1

Goal: design a robust system to be able to display a wide variety of static content, that is maintainable and customisible WITHOUT touching code.

What this means for us: we will be spending our time designing a good CMS system to be able to build the website, rather than faffing around with designing content.

We will be spending our time building a few subsystems, listed in order of importance to implement (these aren’t final! if you have better ideas absolutely get them out there):

1. CMS system for static pages - i.e. first year guide, constitution, etc. including an editor of some variety - this can be a simple markdown editor for a start. Editor would only be accessed by execs/directors for CSESoc. The idea is that these pages can be changed to be whatever as the years go by

2. Special CMS module for landing page - the landing page for the website needs to make a big impression, but a lot of its content will not need to change often at all. To be able to fully model this in the general CMS would be awesome but it is unlikely we will be able to do that within our timeframe (in a stable, usable way). 
The simple solution here is to design the landing page to be semi-static, with some fixed components (e.g. JOIN US / events carousel) which will either change dynamically (e.g. events carousel grabs from facebook) or will allow limited customisation from the CMS (colour, text).

3. Blog system for media posts - this one is arguably going to be the simplest to implement from a CMS side but will require significantly more work as it needs to be usable enough to satisfy the media subcomm (who are used to using professionally made blog tools). This system is not a priority for the scope of this year, unless we make significant progress on the above systems.
   
   

Open

How on earth do we even start?
Building a CMS sounds incredibly intimidating, however, we have some extremely powerful tools at our disposal for this project - especially React.

React allows us to give every element on a page its own file with html, js and css. This could be something like:

• The stories carousel in facebook

• the description box on youtube

• the navigation bar on most
 websites.

(copy paste from figma - images not carried over)

If we design a library of primitive elements for our CMS, e.g. image frames, video embeds, calendar/time displays, title/subheading/text boxes and a good system to place these on the page, we have created all the tools that are needed to create and maintain the website.

What’s next?
We will need to start planning and prototyping right away.

• Planning our user experience and frontend design

  • Designing our ideal editor UI

  • Planning some primative UI elements / working out which ones we need to build a good website

  • Making some layouts for some of our essential pages for reference/demo’s sake

  • About us

  • Constitution

  • Discord/Facebook/ other contacts page

  • Execs and directors

  • First year guide

  • Sponsors
    (these don’t have to be real pages - just figma prototypes :))

• Start building out backend structure for a CMS

  • Planning system structure -> what components will we make and how will they interact? (will make a figma file for this)

  • Work out the role of the backend in the CMS - some obvious ones are
    logins / authentication for staff and editors

  • file management -> how would we store layouts created in the cms?
    etc.

  • Start building our foundational code