search

benawad / codeponder

Marketplace for Code Reviews
280 stars 49 forks source link

mockups #2

Open benawad opened 5 years ago

sterjoski commented 5 years ago

@benawad here are some mock-ups I did today with Figma.

https://www.figma.com/proto/SonrRnx7Gx88kjnTfCzsEmqh/code-ponder?node-id=12%3A107&scaling=min-zoom&redirected=1 (you can use arrows to change pages)

benawad commented 5 years ago

Awesome, thank you. I will use that as a starting point

benawad commented 5 years ago

Should we go with a mobile first approach?

sterjoski commented 5 years ago

Sure, I can make some specific mock ups if you wish just let me know what exactly to make (e.g which components/pages to make first). I'm also open to doing CSS/SCSS/styled-components and/or React stuff.

benawad commented 5 years ago

Ok, I'm going to read through the spec and see what to mockup first.

Maybe I should setup a component library and people can add components to it.

benawad commented 5 years ago

@sterjoski do you want to try doing the My code reviews page where you can see list of code reviews given and the rating received and list of code reviews received

I'm going to attempt the View code review page

sterjoski commented 5 years ago

Sounds good, I'll get on that when I wake up.

I'll also make a few color palettes and Figma components (e.g header and footer) so we can reuse them in all frames.

Once that is done I'll make the project public so you can edit it and add your own frames.

benawad commented 5 years ago

What's the best way to collab with figma? I just made a copy of it and I'm adding stuff from there https://www.figma.com/proto/bV8OMedizU8HBTUQzv72Z1/code-ponder-Copy?node-id=0%3A1&viewport=-7582%2C522%2C0.931269&scaling=min-zoom

sterjoski commented 5 years ago

As far as I know you just hit share in the top right, add people and give them permissions to edit.

benawad commented 5 years ago

actually wait on doing that mockup, I'm thinking about making a change on how something works that page would not be needed at first

byurhannurula commented 5 years ago

@benawad I'm not a designer, but found something like first ui with cards https://dribbble.com/shots/3855792-Ideas-are-Bulletproof

sterjoski commented 5 years ago

Figma collaboration file: link

Figma preview file: link

Let me know what you think @benawad.

benawad commented 5 years ago

@sterjoski

I'll go more in depth with what I'm talking about in my next video

sterjoski commented 5 years ago

Yes to 1, 3 and 4. I didn't have time to implement it, but I was planning to.

should the code be side by side the question/comment thread?

Good idea, makes sense for long files so you always have code and questions on the screen at the same time. I'll mock it up.

Remulos commented 5 years ago

Should we go with a mobile first approach?

  • should the code be side by side the question/comment thread?

I think it's going to be very hard to achieve both of these things to a high standard. I have NO idea how to do it but the best approach I can think of is similar to what VS Code does when you Peek Definition.

benawad commented 5 years ago

I'm cool with having inline comment threads like that