As some of you know I created CodeBoxers over the Christmas break as a side project, I’ve just started with a screencast series and have done 3 videos so far.
Would really appreciate if you guys could spare a few minutes to give me some feedback on them and let me know if they’re on the right track, easy to understand etc or indeed if they’re super boring or too fast and so forth.
First of great vids – Finaly someone is showing how SASS is working in realtime.
Saw the screencasts in crome, and it seemed to my like there was a little delay from when you’re doing the coding and speaking afterwoulds.
Other than that I enjoyed watching the vids.
The videos are awesome all around. One of the most useful things is the actual workflow you use, SublimeText2, Emmet, SCSS, etc… are all so important for people to see because this is how it should be done (the workflow).
The one thing I would even suggest is to possibly make the video pages display in a full width template so I don’t have to zoom in to full screen to see the actual code,
Great screencast, Andy. I’m tempted to start working with sass (is that the correct term?). It seems quite simple to grasp and faster to write. I wasn’t aware you could create variables which is pretty neat.
One thing I don’t like about full width videos is how the video is taller than my browser’s viewport (like on this site), so I automatically click fullscreen anyway.
Would love to see a screencast on working with Kirby compared to WordPress and then link it up in my discussion. By the way, glad to see that heartbeat demo. Nice job.
Many thanks for the awesome feedback.
@nilspedersen – Hmm, I’ll definitely do some testing, I’ve been using Screenflow so maybe theres something in the settings.
@scottnix & @frijolito56 – Thanks for the recommendation, I’ve adjusted the video article container now so they will appear as full width. I’m using FitVids.js by @chriscoyier so they will downsize nicely if you want to trim them down a bit, or have your code editor side by side.
@chrisburton – Great idea, I’ll be using Git Tower later when the static HTML/CSS is done, so creating a fork for a WordPress theme – so at that time, or indeed once the WP theme is done, we can fork again and create a Kirby theme.
@chriscoyier – Many thanks for the encouragement. I think I’m going to stick to the 10min mark as well, I don’t want people to get bored and switch off and also want to make it easy for them to jump in and out.
Thanks for the recommendation on ScreenFlow as well – totes awesome.
@chrisburton – Cheers for the feedback, I think some may have to.
For my next series or during this one I’ll do a “Learn a tool in 5 mins” thing, like show someone how to use Codekit in 5 minutes or something.
Thanks for going full width on the video, much better. :)
Couple of questions, which will also give you a valid excuse to bump this in a bit since you are creating quality material others should see.
So far the videos have been excellent examples for new people to see how a good workflow is achieved. I was curious why you use Emmet for HTML, but not for [SCSS](http://docs.emmet.io/cheat-sheet/ “Emmet Cheat Sheet”)? I think a lot of people would be blown away by how awesome it is for CSS/SCSS.
I was curious why you would opt to add the @include box-sizing(border-box); in specific areas, vs using the (*) selector to target everything and just be done with it? (css-tricks uses it)
Also, I was wondering why you would opt to add a actual clearfix (.cf) to the HTML itself? What about possibly using the Compass @include pie-clearfix; method in the CSS where you need it so it is one less class in the HTML, which if encased in a CMS’s may not be as easy to change as the CSS would (cleaner). I have been wondering this lately. :)
@scottnix – Thanks dude.
Regarding not using Emmet for SCSS – Simply, my brain doesn’t have enough room in it to memorise those shortcuts! To be honest the HTML stuff in emmet is great for me, since it’s ul>li*3 (so a ul with 3 li’s in it) so it’s expressive, but because the CSS stuff is just shortcut’s I would spend so much time trying to remember it would be quicker just to type them out!
Re: border-box, I usually do stick it straight onto the *, for the video though I wanted to ease people into it with a straight forward example, I’ll likely be doing that in the next video.
On the clearfix, I choose to add it as a class for two reasons, one of which is habit, the other is because I can quickly see in my HTML code that I’ve setup clearing already.
I can appreciate the CMS point though, so it’s definitely worth considering, but most of the customer projects Unleash does we use Perch as our CMS, so they just get multiple regions they can type into where all the HTML is behind the scenes.
I’m quite a control freak with my code as well, it took some convincing to use Compass at all at the beginning, I was crafting my own mixins to be 100% in charge!
Makes sense, just was curious behind some of the reasoning and checking to make sure there wasn’t something I was missing. Thanks for the response.
I still say you show them some Emmet in the CSS, a quick mention, even if you don’t use it. I only say that because your video is already such a good example of a speedy workflow, epic for beginners. :)
You must be logged in to reply to this topic.
*May or may not contain any actual "CSS" or "Tricks".