Code Monkey home page Code Monkey logo

maze-render's Introduction

Maze Renderer

Developed in C++ and OpenGL for CS 5610 Interactive Computer Graphics at the University of Utah, Spring 2016.

The project was developed alongside my Maze Generator project: github here

Project Description

This project aims to render a maze-like series of walls and floors in a first-person perspective. The walls use bump-mapped textures, and along the ground are randomly placed billboard sprites that resemble grass. The floor is also made to look like a big pool of reflective water, that reflects the walls/grass and distorts the reflection with a ripple effect.

###It's a "Game".

The renderer also serves as sort of a "game". In this context, "game" means:

  1. There is a starting point.
  2. There is collision detection to prevent walking through the walls
  3. There is an ending point (designated by a "trophy" billboard sprite).

There is not much else to the "game" portion of things. No win condition, really. It just makes it a bit more interesting.

###Grass rendering

The grass rendering algorithm goes like so:

  • For every piece of floor (provided by the maze-generator), we render X sprites of grass.
  • The grass sprites are places pseudo-randomly across that square of floor. It uses a non-uniform distribution method (i.e. totally random).
  • That's it.

Currently there are about 36 sprites of grass rendered per piece of floor.

###Reflection/Water rendering

To get the reflective floor:

  • First a framebuffer object is created.
  • The framebuffer is then set to render to a texture.
  • We then draw the walls, grass, and trophy all upside-down from their normal position.
  • The current framebuffer is then swapped to the default framebuffer.

These steps allow us to get a "reflection" of the walls/sprites into a texture. From here, we draw the floors and pass in our new texture, setting the uv-coordinates for the texture as the on-screen coordinates of each fragment (gl_FragCoord.xy).

To get the ripple effect, I use a simple sin wave pattern to displace the x-position of the texture coordinate: tc.x + (sin((tc.y + current_time) * frequency) * amplitude). I use the y-component of the texture coordinate to create the illusion that the ripples are smaller the further away the floor is. It's a personal preference, really.

###Screenshots

Screenshot 1 Screenshot 2

maze-render's People

Contributors

enewey avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.