index.html

---
layout: index
extra_js:
- jquery.autosuggest
- jsrender.min
- index
---

<div class="row top">
    <div class="col-xs-12 col-sm-4">
        <h3>Join or form groups</h3>
    </div>
    <div class="col-xs-12 col-sm-4">
        <h3>Share, discuss and publish</h3>
    </div>
    <div class="col-xs-12 col-sm-4">
        <h3>Discover learning communities</h3>
    </div>
</div>
<div class="row">
    <div class="col-xs-12 text-center">
        <div class="diagram">
            <h2>Connect in ways that work</h2>
        </div>
    </div>
</div>
<div class="row bottom diagram-bottom-line-top">
    <div class="col-xs-4">
        <h3>In groups, or one-on-one</h3>
    </div>
    <div class="col-xs-4">
        <h3>With your campus community</h3>
    </div>
    <div class="col-xs-4">
        <h3>Across boundaries</h3>
    </div>
</div>
<!-- <div class="row">
<div class="col-xs-4">Easily collaborate with anyone anywhere in small or large groups</div>
<div class="col-xs-4 col-xs-offset-4">Seamlessly work with people at other insitutions all around the world</div>
</div> -->

<div class="row clearfix row-call-to-action">
    <div class="col-xs-12">
        <h2>
        <div>
            OAE is <strong>fully open</strong> and created and backed by universities.
        </div>
        <div>
            It’s free and simple to get started
        </div></h2>
    </div>
</div>

<div class="row diagram-bottom-line-bottom">
    <div class="col-xs-12 col-sm-8 text-left">
        <div class="search-group">
            <div id="institution-search">
                <input type="text" placeholder="Search and select your university" id="institution-search-field">
            </div>
        </div>
        <label for="institution-search-field" class="hide">Search and select your university</label>
    </div>
    <div class="col-xs-12 col-sm-4">
        <a href="https://network.unity.ac" class="btn btn-lg btn-default btn-not-at-a-university" target="_blank">I'm not at a university</a>
    </div>
</div>

<div class="row row-location">
    <div class="col-xs-12">
        <h2>Join people at over 20,000 institutions worldwide</h2>
        <ul class="logo-blocks">
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/aar.png" alt="American Academy of Religion" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/gatech.png" alt="Georgia Institute of Technology" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/marist.png" alt="Marist College" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/texasstate.png" alt="Texas State University" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/amsterdam.png" alt="University of Amsterdam" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/cambridge.png" alt="University of Cambridge" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/esup.png" alt="ESUP Portail" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/murcia.png" alt="University of Murcia" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/anu.png" alt="Australian National University" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/capetown.png" alt="University of Cape Town" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/isv.png" alt="Independent Schools Victoria" />
                </div>
            </li>
            <li>
                <div class="logo">
                    <!-- data-toggle="modal" data-target="#case-study"> -->
                    <img src="/assets/img/logos/bc.png" alt="British Council" />
                </div>
            </li>
        </ul>
    </div>
</div>

<!-- Modal -->
<div class="modal fade case-study" id="case-study" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel">Case study</h4>
            </div>
            <div class="modal-body">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-xs-12"><img src="/assets/img/logos/aar.png" alt="American academy of Religion" />
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-12 col-sm-8">
                            <p>
                                <strong>Leadership Position within Higher Education</strong>
                            </p>
                            <p>
                                As the era of downloading and installing software shifts toward utilizing cloud-based services the traditional concepts of open source and the underlying open source communities that produce software is also shifting, in some cases quite dramatically.  As a result of this shift, higher education has seen the emergence of new “cloud-based” open source models such as KualiCo and Instructure/Canvas which have commercial companies leading software development as well as hosting cloud-based services using that software.  Although technically still “open source” as they release most of their code under open licenses, in these models the commercial entities have opted to not release key pieces of their systems as means to place barriers to others deploying and hosting on their own.  For example, in both the case of KualiCo and Instructure, code related to running multi-tenant systems, which is crucial if you wish to host a cloud service yourself, are not released under open licenses.
                            </p>
                        </div>
                        <div class="col-xs-12 col-sm-4">
                            <div class="modal-sidebar">
                                <blockquote>
                                    &ldquo;The OAE is like the open areas in a university where you meet, study and work in a shared environment.&rdquo;
                                    <br />
                                    <cite>Clay Fenlasson</cite>
                                </blockquote>
                                <a href="/join" class="btn btn-lg btn-oae">Join the network</a>
                                <a href="https://network.unity.ac" target="_blank" class="btn btn-lg btn-oae">Try now</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>