Skip to content

Commit

Permalink
Update index.html
Browse files Browse the repository at this point in the history
  • Loading branch information
@FelipeHODiniz
FelipeHODiniz authored Apr 22, 2024
1 parent a631dfd commit 559020a
Showing 1 changed file with 44 additions and 69 deletions.
113 changes: 44 additions & 69 deletions docs/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -182,8 +182,8 @@ <h4>Processo de Design Thinking</h4>
<div class="alert alert-warning collapse" role="alert" id="collapseProcesso">
<p>Apresente o processo de Design Thinking realizado pelo grupo e documentado por meio do software Miro. No documento apresentado, devem ser incluídos: (1) a matriz CSD, (2) o mapa de stakeholders, (3) as personas, (4) as respectivas propostas de valor e (5) o processo de ideação identificando as ideias levantadas e sua priorização.</p>
</div>
<object data="assets/files/processo-dt.pdf" type="application/pdf" width="100%" height="500px">
<p>Não foi possível apresentar o arquivo PDF. Faça o download e abra no seu computador: <a href="/assets/files/processo-dt.pdf">Download</a></p>
<object data="assets/files/Design Thinking COLLABORA - Sprint 1.pdf" type="application/pdf" width="100%" height="500px">
<p>Não foi possível apresentar o arquivo PDF. Faça o download e abra no seu computador: <a href="/assets/files/Design Thinking COLLABORA - Sprint 1.pdf">Download</a></p>
</object>
</section>

Expand Down Expand Up @@ -215,13 +215,13 @@ <h5>Histórias de Usuários</h5>
<tbody>
<tr>
<th scope="row">Usuário do sistema</th>
<td>Registrar minhas tarefas<span class="exemplo">EXEMPLO</span></td>
<td>Não esquecer de fazê-las</td>
<td>Acessibilidade a um especialista</td>
<td>Sanar as minhas duvidas</td>
</tr>
<tr>
<th scope="row">Administrador</th>
<td>Alterar permissões<span class="exemplo">EXEMPLO</span></td>
<td>Permitir que possam administrar contas</td>
<th scope="row">Usuário Premium</th>
<td>Ter controle da sala</td>
<td>Poder criar salas e expulsar os indesejados</td>
</tr>
</tbody>
</table>
Expand Down Expand Up @@ -256,14 +256,24 @@ <h5>Requisitos</h5>
<tbody>
<tr>
<th scope="row">RF-001</th>
<td>Permitir que o usuário cadastre tarefas<span class="exemplo">EXEMPLO</span></td>
<td>Presença de um especialista 24h</td>
<td>ALTA</td>
</tr>
<tr>
<th scope="row">RF-002</th>
<td>Emitir um relatório de tarefas no mês<span class="exemplo">EXEMPLO</span></td>
<td>MÉDIA</td>
<td>Salas Interativas</td>
<td>ALTA</td>
</tr>
<tr>
<th scope="row">RF-003</th>
<td>Oficina online de correção de redação </td>
<td>BAIXA</td>
</tr>
<tr>
<th scope="row">RF-004</th>
<td>Usuário Premium: pode criar própria sala</td>
<td>MEDIA</td>
</tr>
</tbody>
</table>

Expand All @@ -279,13 +289,13 @@ <h5>Requisitos</h5>
<tbody>
<tr>
<th scope="row">RNF-001</th>
<td>O sistema deve ser responsivo para rodar em um dispositivos móvel<span class="exemplo">EXEMPLO</span></td>
<td>MÉDIA</td>
<td>Acesso de qualquer lugar do país</td>
<td>ALTA</td>
</tr>
<tr>
<th scope="row">RNF-002</th>
<td>Deve processar requisições do usuário em no máximo 3s<span class="exemplo">EXEMPLO</span></td>
<td>BAIXA</td>
<td>Acesso 24 horas por dia</td>
<td>ALTA</td>
</tr>
</tbody>
</table>
Expand Down Expand Up @@ -313,18 +323,7 @@ <h5>User/Screen Flow e Protótipo interativo</h5>
<iframe title="Protótipo interativo" src="https://marvelapp.com/prototype/4hd6091?emb=1&iosapp=false&frameless=false" width="600px" height="360px" allowtransparency="true" frameborder="0"></iframe>
</p>
</div>
<p>...... COLOQUE AQUI O DIAGRAMA DE USER FLOW E O LINK PARA O PROTÓTIPO INTERATIVO ......</p>
</section>

<section>
<h5>Wireframes</h5>
<p>Protótipo de telas do sistema em baixa fidelidade (rascunhos).
<button type="button" class="btn btn-light btn-sm float-right" data-toggle="collapse" href="#collapseWireframes">Info</button>
</p>
<div class="alert alert-warning collapse" role="alert" id="collapseWireframes">
<p>Os Wireframes são protótipos das telas da aplicação usados em design de interface para sugerir a estrutura de um site web e seu relacionamentos entre suas páginas. Um wireframe web é uma ilustração semelhante ao layout de elementos fundamentais na interface. <img class="img-fluid" src="assets/images/exemplo-wireframe.png" alt="Exemplo de wireframe"></p>
</div>
<p>...... COLOQUE AQUI OS PROTÓTIPO DE TELAS E SUA DESCRIÇÃO ......</p>
<p><a href="https://www.figma.com/file/mj3C3ORobuP9sCxE3npfvb/Untitled?type=design&node-id=0-1&mode=design&t=eJRuXjyWd4WgyHpr-0">https://www.figma.com/file/mj3C3ORobuP9sCxE3npfvb/Untitled?type=design&node-id=0-1&mode=design&t=eJRuXjyWd4WgyHpr-0</a></p>
</section>

</section>
Expand Down Expand Up @@ -393,10 +392,10 @@ <h4>Gestão do Projeto</h4>
<p>Apresente a divisão de papéis e tarefas entre os membros do grupo. Informe quem é o Scrum Master, o Product Owner e os desenvolvedores. Informe também quem é o responsável pela documentação do projeto.</p>
<p>Apresente o quadro de gerenciamento do time (Kanban), seu formato e as experiências na utilização dessa ferramenta (GitHub Projects) </p>
</div>
<p>...... COLOQUE AQUI O SEU TEXTO ......</p>
<img src="assets/images/Kanban.jpg" alt="Kanban">
</section>


<!-- Funcionalidades ====================
<section id="ti_controle_versao">
<h4>Controle de Versão</h4>
<p>Estrutura do fluxo de trabalho no ambiente do GitHub.
Expand All @@ -423,18 +422,6 @@ <h2>Solução</h2>
<p>Inclua, para cada funcionalidade, itens como: (1) titulos e descrição da funcionalidade; (2) Estrutura de dados associada; (3) o detalhe sobre as instruções de acesso e uso.</p>
</div>

<section id="ti_video">
<h4>Video do Projeto</h4>
<p>O vídeo a seguir traz uma apresentação do problema que a equipe está tratando e a proposta de solução.
<button type="button" class="btn btn-light btn-sm float-right" data-toggle="collapse" href="#collapseVideo">Info</button>
</p>
<div class="alert alert-warning collapse" role="alert" id="collapseVideo">
<p>O video de apresentação é voltado para que o público externo possa conhecer a solução. O formato é livre, sendo importante que seja apresentado o problema e a solução numa linguagem descomplicada e direta.</p>
<p>Utilize o recurso de compartilhamento via embed e inclua o vídeo logo abaixo.</p>
</div>
<p>...... COLOQUE AQUI O SEU VIDEO ......</p>
</section>

<section id="ti_funcionalidades">
<h4>Funcionalidades</h4>
<p>Esta seção apresenta as funcionalidades da solução.
Expand All @@ -446,21 +433,20 @@ <h4>Funcionalidades</h4>
</div>

<section>
<h5>Funcionalidade 1 - Cadastro de Contatos<span class="exemplo">EXEMPLO</span></h5>
<p>Permite a inclusão, leitura, alteração e exclusão de contatos para o sistema</p>
<h5>Funcionalidade 1 - Sala Online</h5>
<p>Permite que os vestibulandos estudem em grupo</p>
<ul class="list-unstyled">
<li><strong>Estrutura de dados: </strong><a href="#ti_ed_contatos">Contatos</a></li>
<li><strong>Estrutura de dados: </strong><a href="#ti_ed_contatos">Salas</a></li>
<li><strong>Instruções de acesso: </strong><ul>
<li>Abra o site e efetue o login</li>
<li>Acesse o menu principal e escolha a opção Cadastros </li>
<li>Em seguida, escolha a opção Contatos</li>
<li>Vá em salas e escolha a sua</li>
</ul></li>
</ul>
<p class="text-center"><img class="img-fluid" src="assets/images/exemplo-funcionalidade.png" alt="Tela Cadastro de Contatos"></p>
<p class="text-center"><img class="img-fluid" src="assets/images/Funcionalidade.png" alt="Tela Cadastro de Contatos"></p>
</section>
</section>

<!-- Estruturas de dados =============== -->
<!-- Estruturas de dados ===============
<section id="ti_estruturas_dados">
<h4>Estruturas de Dados</h4>
<p>Descrição das estruturas de dados utilizadas na solução com exemplos no formato JSON.
Expand All @@ -472,7 +458,7 @@ <h4>Estruturas de Dados</h4>
</div>
<section>
<h5>Estrutura de Dados - Contatos<span class="exemplo">EXEMPLO</span></h5>
<h5>Estrutura de Dados - Contatos</h5>
<p>Contatos da aplicação</p>
<pre>
{
Expand All @@ -488,7 +474,7 @@ <h5>Estrutura de Dados - Contatos<span class="exemplo">EXEMPLO</span></h5>
</section>
<section>
<h5>Estrutura de Dados - Usuários<span class="exemplo">EXEMPLO</span></h5>
<h5>Estrutura de Dados - Usuários</h5>
<p>Registro dos usuários do sistema utilizados para login e para o perfil do sistema</p>
<pre>
{
Expand Down Expand Up @@ -516,22 +502,22 @@ <h4>Módulos e APIs</h4>
<section>
<h5>Images:</h5>
<ul>
<li>Unsplash - <a target="_blank" href="https://unsplash.com/">https://unsplash.com/</a><span class="exemplo">EXEMPLO</span></li>
<li>Unsplash - <a target="_blank" href="https://unsplash.com/">https://unsplash.com/</a></li>
</ul>
</section>

<section>
<h5>Fonts:</h5>
<ul>
<li>Icons Font Face - <a target="_blank" href="https://fontawesome.com/">https://fontawesome.com/</a><span class="exemplo">EXEMPLO</span></li>
<li>Icons Font Face - <a target="_blank" href="https://fontawesome.com/">https://fontawesome.com/</a></li>
</ul>
</section>

<section>
<h5>Scripts:</h5>
<ul>
<li>jQuery - <a target="_blank" href="http://www.jquery.com/">http://www.jquery.com/</a><span class="exemplo">EXEMPLO</span></li>
<li>Bootstrap 4 - <a target="_blank" href="http://getbootstrap.com/">http://getbootstrap.com/</a><span class="exemplo">EXEMPLO</span></li>
<li>jQuery - <a target="_blank" href="http://www.jquery.com/">http://www.jquery.com/</a></li>
<li>Bootstrap 4 - <a target="_blank" href="http://getbootstrap.com/">http://getbootstrap.com/</a></li>
</ul>
</section>
</section>
Expand All @@ -549,14 +535,14 @@ <h2>FAQ</h2>
<p>Apresente uma lista de perguntas e respostas comuns associadas ao projeto. Inclua perguntas como: (1) detalhes de acesso e uso do projeto; (2) informações sobre a instalação e configuração da aplicação; (3) questões sobre a manutenção da aplicação; (4) detalhes sobre a integração da aplicação com outros sistemas; (5) questões sobre a segurança da aplicação.</p>
</div>

<span class="exemplo">EXEMPLO</span>

<div class="row">
<div class="col-lg-12">
<div class="accordion accordion-alterate arrow-right" id="popularTopics">
<div class="card">
<div class="card-header" id="heading1">
<h5 class="mb-0"> <a href="#" class="collapsed" data-toggle="collapse" data-target="#collapse1"
aria-expanded="false" aria-controls="collapse1">What does royalty free mean?</a> </h5>
aria-expanded="false" aria-controls="collapse1">Como funcionará o site?</a> </h5>
</div>
<div id="collapse1" class="collapse" aria-labelledby="heading1" data-parent="#popularTopics">
<div class="card-body"> Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Expand All @@ -569,7 +555,7 @@ <h5 class="mb-0"> <a href="#" class="collapsed" data-toggle="collapse" data-targ
<div class="card">
<div class="card-header" id="heading2">
<h5 class="mb-0"> <a href="#" class="collapsed" data-toggle="collapse" data-target="#collapse2"
aria-expanded="false" aria-controls="collapse2">What is a single application?</a> </h5>
aria-expanded="false" aria-controls="collapse2">Será pago ou gratuito?</a> </h5>
</div>
<div id="collapse2" class="collapse" aria-labelledby="heading2" data-parent="#popularTopics">
<div class="card-body"> Iisque Anim pariatur cliche reprehenderit, enim eiusmod high life
Expand All @@ -579,18 +565,7 @@ <h5 class="mb-0"> <a href="#" class="collapsed" data-toggle="collapse" data-targ
proident. Ad vegan excepteur butcher vice lomo. </div>
</div>
</div>
<div class="card">
<div class="card-header" id="heading3">
<h5 class="mb-0"> <a href="#" class="collapsed" data-toggle="collapse" data-target="#collapse3"
aria-expanded="false" aria-controls="collapse3">What are some examples of permitted end
products?</a> </h5>
</div>
<div id="collapse3" class="collapse" aria-labelledby="heading3" data-parent="#popularTopics">
<div class="card-body"> Iisque persius interesset his et, in quot quidam persequeris vim, ad mea
essent possim iriure. Mutat tacimates id sit. Ridens mediocritatem ius an, eu nec magna
imperdiet. </div>
</div>
</div>

</div>
</div>
</div>
Expand All @@ -606,7 +581,7 @@ <h2>Referências Bibliográficas</h2>
<div class="alert alert-warning collapse" role="alert" id="collapseReferencias">
<p>Apresente as referências bibliográficas utilizadas no projeto. Inclua itens como: (1) livros, artigos, tutoriais, etc. utilizados no desenvolvimento da solução; (2) links para sites, blogs, etc. utilizados no desenvolvimento da solução.</p>
</div>
<p>...... COLOQUE AQUI O SEU TEXTO ......</p>
<a href="http://slidesgo.com">http://slidesgo.com</a>
</section>

</div>
Expand Down

0 comments on commit 559020a

Please sign in to comment.