campriest / New-FYC

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

New-FYC

Objective: React and Socket.io Project--to create conversations around media.

Insipiration: Medium and dwell.

Sketch Wireframe: alt text

UI Stages:

Notes: Create a three column structure to organize card content flow. Basic hamburg menu--it is not the main focus. So hiding the menu options will not confuse users. The main focus for menu is the header bar, which is displayed by text. alt text

Notes: Create card content structure. The cards will hold a visual element--photo or picture. A side menu bar has been added for the chat feature. alt text

Notes: Change the background to all white--less distraction and keeps design consistency. Adding a slim border radius creates separation and provides clean design elements to the card layout. alt text

Notes: Changed the menu text to a lighter, slimmer font. alttext

Notes: Change card side menu color and font. The side menu placement needs to be corrected. alt text

Notes: The use of text is not engaging enough--does not notify users that it is an actual button and opens to a chat UI. alt text

Notes: The message icon shows that there is UI function that is part of the box. The red color provides focus and grabs the user's attention. alt text

About


Languages

Language:JavaScript 94.4%Language:HTML 5.6%