Binari icon indicating copy to clipboard operation
Binari copied to clipboard

Design Work

Open BrandonArmand opened this issue 5 years ago • 8 comments

Design Changes

There are a lot of little design issues that could use some touch-up; such as, margin spacing, empty landing page, playground sizing, and probably so much more. This is the issue for all design work, please tag it on PRs related to design changes.

This will be an on-going issues, do whatever you think needs to be done to Binari. I will take any suggestion that you think will help with the overall design.

Anything that changes the UI/UX too drastically will be reviewed by @gigirubi

Suggestions:

  • [ ] Landing Page
    • [x] Align sections in a more appealing manner.
    • [x] Add video information.
    • [ ] Create a logo to display next to the title.
  • [ ] Playground
    • [ ] Design the canvas (just white is too basic)
  • [x] About

BrandonArmand avatar Jan 23 '20 18:01 BrandonArmand

Hi! I've made a pull request that includes aligning sections for the landing and about page, as well as adding video information to the landing page and fixing any spelling/grammatical errors: https://github.com/BrandonArmand/Binari/pull/33.

angelagomba avatar Mar 03 '20 20:03 angelagomba

Do we have a moke-up of what the final design should look like? its may be helpful if we could create a Figma.com design so people can start contributing to it. I am not good at design but I can help in implementing it.

OmarShezan avatar Jul 13 '20 15:07 OmarShezan

Hey @OmarShezan,

As far as design goes, we are working on a mock up for the playground in Figma by @gigirubi, but as for everything else, it is sorta just a free-for-all. The initial design is implemented, so there isn't much to do there, but if you have any ideas that you think will work great, please feel free to pitch your ideas. The playground mockup probably won't be ready for some time as it is currently a very hectic time for us.

A couple current things that need some work is:

  1. Landing page could use more love. It is very basic and although describes Binari well, it doesn't quite hook the user.
  2. When an error occurs in the playground, the error screen no longer fills the entire height of the parent div on some browsers.
  3. When the playground is first opened, I would like an entry screen before it jumps into the code.
    • Animated in some way.
    • Different design than the current playground layout.
    • Leads into an interactive (of sorts) tutorial
    • (This is obviously a big addition to the site, and won't be added until later, but I figured I should include it on the list as it is something that we will get to eventually.)

When we have a mockup going, I will be sure to ping you. You are welcome to make addition as you see fit until then and we will review them and give feedback.

Best of luck!

BrandonArmand avatar Jul 13 '20 22:07 BrandonArmand

Hey @BrandonArmand I would like to make changes in the Home page design into a bit of dynamic one.

Vinamra2009 avatar Aug 13 '20 16:08 Vinamra2009

@Vinamra2009 Sounds great (: Would love to see what you do.

BrandonArmand avatar Aug 13 '20 16:08 BrandonArmand

Hi @BrandonArmand, is the mockup ready? If so, do you need any help in implementing it? I'm looking for an open-source issue related to front-end development, so it would be nice if I could help in some way.

inarie avatar May 14 '22 22:05 inarie

hey @BrandonArmand found out that this issue can be solved i have a great idea that can make interface of website more appealing and interactive to users would you assign it to me under hacktoberfest more things can be added like buttons , gradient colours , light/dark mode toggle

Cypher1002 avatar Oct 04 '22 04:10 Cypher1002