I am working on a playground for designers and front end developers. One of the features it has is the live preview. This means that while you are changing your html or css code you can preview the result in real time. Most of other similar sites like jsbin, jsfiddle, codepen are solving this problem by using panels. The problem with these is that you can preview the page you are working on just in a that small pane. In Adobe Dreamveaver you can split the screen. You code on the left side, and preview it on the right side. I'm trying to make that "live preview" experience better. I would love to have a preview area as big as possible, but still have enough space for writing code.
One possible solution can be having the preview full screen, and writing code in a moveable window. The window will cover some part of the preview, but you can move it where you want.
My question is: How can I improve the live preview exprience in this situation? Is there a better way to improve ux?