mockups

[benawad]

No description provided.

[sterjoski]

@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]

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

[benawad]

Should we go with a mobile first approach?

[sterjoski]

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]

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]

@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]

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]

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]

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

[benawad]

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]

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

[sterjoski]

Figma collaboration file: link

Figma preview file: link

Let me know what you think @benawad.

[benawad]

@sterjoski

• I think each question should be a comment thread
• should the code be side by side the question/comment thread?
• stuff should be able to collapse/expand
• should we add username/profile pics to questions/comments?

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

[sterjoski]

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]

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]

I'm cool with having inline comment threads like that