Help how did you learn bbcode? also how do you mock up your designs? what are some resources you used to learn?

[monxmiracle]

So I have a background and experience in WebDesign, using HTML / CSS as well as some familiarity with Figma and Adobe XD. And I was wonderIng with those skills if it would be possible to create aesthetic bbcodes. For experienced bbcode designers what’s your process, how do you make sure the codes work and can be used on various platforms, etc. I’ve been interested in learning bbcode and like brushing up on previous design skills so please feel free to share some advice!

 

[Uxie]

hello ♡
i'm self-taught in terms of the css/html used in bbcode+, and my main learning process was using online resources while breaking apart other's codes to figure out how to do certain things! i feel like a background isn't necessary, but is probably helpful! i know quite a few bbcoders who also have a background in it ( ´ ▿ ` )
mock-up-wise i'd recommend anything you're comfortable with, i don't think there's any particular platform that's better than another, though i would not personally rely on the code output of adobe xd in terms of creating a functional code; for design, i think it's still okay ^^

for device compatibility, i'm still not the best at it, but it's a lot of percentages, max-width, flexbox and clamp usually. it tends to be a lot of trial and error, and i rely a lot on using the inspect element -> toggle device toolbar function on chrome a lot. i feel like there are others who might be better at making tutorials for that sort of thing, but if you have any specific questions, i'd be happy to help still. hope this helps! ٩(｡•́‿•̀｡)۶

 

[Alteras]

With BBCode, you got two routes, stick to the spirit of BBCode and use the tags the way they were intended, or apply jank. The BBCode parser has a lot of gaps to actually just add inline style CSS. So you can apply your CSS skills to it (we call it CSS Injection). Everything is all inline, so responsive design is entirely based on your ability to make responsive layouts without any media queries. So a healthy dose of flexbox, grid, and probably some weird tricks using calc().

If you want to work in an IDE and do local testing, just code as if you were coding in HTML, but restrict yourself to <div style="style here">. Then you can go back and just do a global find and replace to [border="unset; padding: unset; style here"]

If you want to stick to the spirit of BBCode, I'd say just practice and have fun? BBCode is very limited, but you'll be able to find some examples of wonderful bbcode that doesn't rely on CSS Injection.

Oh, and before I forget, we have the Private Workshop where you can test and make posts without anyone looking.

https://www.rpnation.com/workshop/

 

[Yorki]

Any suggestions on how a beginner like me can practice? Aside from the resources available on RPN, are there any other basic ones that are recommended?

 

[weldherwings]

I grew up using html/css, building websites and neopet/myspace/tumblr layouts using microsoft frontpage (rip) ~!
i basically transferred what i could remember and stuck them into the [border] tags asodjaosjd
the main advice i guess is to just mess around! have a look at how other people use and manipulate codes and have a crack at it yourself!

if you have discord, i also have a server where you can ask people for advice, help and resources for all things bbcode!

Join the 𝙇𝙀𝙑𝙀𝙇 𝙐𝙋! 𝘽𝘽𝘾𝙊𝘿𝙀𝙍𝙎 Discord Server!

Check out the 𝙇𝙀𝙑𝙀𝙇 𝙐𝙋! 𝘽𝘽𝘾𝙊𝘿𝙀𝙍𝙎 community on Discord - hang out with 31 other members and enjoy free voice and text chat.

discord.gg

 

[Yorki]

Cool, I'll be checking this out. Gonna get one step closer in prettying up my posts.