# Redesigning the SEF Site

**URL:** <https://sef.discourse.group/t/redesigning-the-sef-site/309>\
**Category:** Design\
**Created:** [June 27, 2021, 2:22pm UTC](https://sef.discourse.group/t/redesigning-the-sef-site/309 "2021-06-27T14:22:19Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![YohanAvishke](https://yyz2.discourse-cdn.com/free1/user_avatar/sef.discourse.group/yohanavishke/32/106_2.png) [@YohanAvishke](https://sef.discourse.group/u/YohanAvishke)\
**Post date:** [June 27, 2021, 2:22pm UTC](https://sef.discourse.group/t/redesigning-the-sef-site/309/1 "2021-06-27T14:22:19Z")

</div>

Decision to redesign was clear. Current site even though preforms on the aspect of functionality, fails to impress the eyes of our client.  
Current Website: [https://sefglobal.org](https://sefglobal.org)

Due to the mentioned fact the topic has been brought up and worked on multiple times by the team. But was failed to achieve each and every time. After long discussions it was clear that the problem was starting the designing from a middle point.  
So the focus of this thread is to start the design process from scratch and continue till the end.

Goals to achieve (in order)

1. Designing Wireframes.
2. Picking a Design System.
3. Content creation (Images, texts, links, etc.)
4. Creating mockups/visual elements.
5. Developing the website.

## Breaking-down the Goals

### 1. Designing Wireframes.

Extremely simplistic diagram showing how the website is linked together. This will help to identify caveats in the current design. And to identify high priority pages that are harder to visit. Having the wireframes will help to rearrange existing pages and when adding new pages in the future.

**Estimated time: 2 weeks**

### 2. Picking a Design System.

Design system should provide necessary tools to confidently design the website.

> **[Components – Material Design 3](https://m3.material.io/components/)**
>
> Discover over 30 Material Design UI components and their functions. Understand how to use them to design intuitive and visually appealing user experiences.

**Estimated time: 1 week**

### 3. Content creation (Images, texts, links, etc.)

[@EngTeam](https://sef.discourse.group/groups/engteam) should discuss with other teams and gather necessary content for each page. Content should be finalised (should be copy and paste-able) before moving onto the next step.

**Estimated time: 2 weeks**

### 4. Creating mockups/visual elements.

Hardest step to complete. But the help of all the before steps, should help tremendously.

**Estimated time: 2 months**

### 5. Developing the website.

Coding `<html>`

**Estimated time: 2 months**

Threads should be created to each an every individual step explaining in detail.  
These goals are not finalised and just my individual opinion. Before starting from the first step, we need to finalise the goals. So anyone’s suggestions are more than welcome.

cc: [@EngTeam](https://sef.discourse.group/groups/engteam) @akshika47

---

<div class="post-metadata">

**Author:** ![jaye](https://yyz2.discourse-cdn.com/free1/user_avatar/sef.discourse.group/jaye/32/810_2.png) [@jaye](https://sef.discourse.group/u/jaye)\
**Post date:** [June 27, 2021, 4:20pm UTC](https://sef.discourse.group/t/redesigning-the-sef-site/309/2 "2021-06-27T16:20:30Z")

</div>

Thanks for initiating this thread @YohanAvishke !  
I think finalizing content would need some effort. Especially on planing what pages should be there and what we going to display. Ramith and the team can work on this in parallel while dev team is working on task 1 and 2.

---

<div class="post-metadata">

**Author:** ![akshika47](https://yyz2.discourse-cdn.com/free1/user_avatar/sef.discourse.group/akshika47/32/993_2.png) [@akshika47](https://sef.discourse.group/u/akshika47)\
**Post date:** [June 29, 2021, 4:25am UTC](https://sef.discourse.group/t/redesigning-the-sef-site/309/3 "2021-06-29T04:25:00Z")

</div>

This is a great thread.

Some more suggestions.

1. We need to think about the information architecture ([https://www.nngroup.com/articles/ia-vs-navigation/](https://www.nngroup.com/articles/ia-vs-navigation/)). This is should come before wire-framing or in-parallel with that.
2. I like the 3rd step. Maybe we can extend this to long-term data storage as well. For example what Gajindu suggested with Google-sheets.