From c7a7b5f29fe76933b77f5518913873457e8bec30 Mon Sep 17 00:00:00 2001 From: "christian.cardenas" <christian.cardenas@anahuac.mx> Date: Mon, 26 Feb 2018 22:25:56 -0600 Subject: [PATCH] index_0.6 and week 5 --- Week_5.html | 982 ++++++++++++++++++++++++++++++++++++++++++++++++++++ index.html | 4 +- 2 files changed, 984 insertions(+), 2 deletions(-) create mode 100644 Week_5.html diff --git a/Week_5.html b/Week_5.html new file mode 100644 index 0000000..760ddb3 --- /dev/null +++ b/Week_5.html @@ -0,0 +1,982 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <meta name="description" content="My fab academy project"> + <meta name="author" content="Christrian Cárdenas"> + + <title>FAB Acadaemy | Christian Cárdenas</title> + + <link rel="shortcut icon" href="../img/favicon.ico"> + + <!-- Bootstrap Core CSS --> + <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet"> + + <!-- Theme CSS --> + <link href="css/freelancer.css" rel="stylesheet"> + + <!-- Custom Fonts --> + <link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> + <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css"> + <link href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css"> + + <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> + <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> + <!--[if lt IE 9]> + <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> + <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> + <![endif]--> + +</head> + +<body id="page-top" class="index"> + + <!-- Navigation --> + <nav id="mainNav" class="navbar navbar-default navbar-fixed-top navbar-custom"> + <div class="container"> + <!-- Brand and toggle get grouped for better mobile display --> + <div class="navbar-header page-scroll"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> + <span class="sr-only">Toggle navigation</span> Menu <i class="fa fa-bars"></i> + </button> + <a class="navbar-brand" href="#page-top">Christian Cárdenas | Assignments - Week 5</a> + </div> + + <!-- Collect the nav links, forms, and other content for toggling --> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> + <ul class="nav navbar-nav navbar-right"> + <li class="hidden"> + <a href="#page-top"></a> + </li> + <li> + <a href="Week_4.html"><< Week 4</a> + </li> + <li class="page-scroll"> + <a href="index.html">Home</a> + </li> + <li> + <a href="Week_6.html">Week 6 >></a> + </li> + </ul> + </div> + <!-- /.navbar-collapse --> + </div> + <!-- /.container-fluid --> + </nav> + + <!-- Header --> + <header> + <div class="container"> + <div class="row"> + <div class="col-lg-12"> + <!-- <img class="img-responsive center-block" src="https://dl.dropboxusercontent.com/u/4917033/img/Fab_Lab_logo.svg.png" style="width: 200px; height: 240px"> --> + <div class="intro-text"> + <span class="name">Week 5</span> + <hr class="star-light"> + <h1> 3D Scanning and printing </h1> + </div> + </div> + </div> + </div> + </header> + + + <!-- About Section --> + <section class="success" id="about"> + <div class="container"> + <div class="row"> + <div class="col-lg-6 "> + + <p align="justify" padding-top="20px" style="font-size:24px; color:#91aac3" > <em><u> Assignment </u></em></p> + <ol style="font-size:18px"> + <li>Test the design rules for your printer</li> + <li>Design and 3D print and object</li> + <li>3D scan an object and print it</li> + </ol> + </div> + + <div class="col-lg-6 "> + + <p align="justify" style="font-size:24px; color:#91aac3" > <em><u> Personal objectives </u></em></p> + <ol style="font-size:18px"> + <li align="justify">- Know about the design rules for 3D printing and the influence of materials and printers in the results</li> + <li align="justify">- Learn the 3D scan technique and the methods to fix the scans</li> + </ol> + </div> + <div class="col-lg-12 text-center"> + <h3 align="center"> <u> 3D Printer test </u> </h3></p> + <p align="justify" style="font-size:18px"> For this part of the assignment I Just test a model for testing available in thingiverse: <a href="https://www.thingiverse.com/thing:1363023">Ctrl V Test</a> + in the two printers available at Anáhuac Querétaro: A <a href="https://ultimaker.com/en/products/ultimaker-2-plus">ultimaker 2+ Extended</a> an a <a href="http://us.xyzprinting.com/us_en/Product/da-Vinci-1.0">XYZ DaVinci 1.0.</a> + This test include several features as Z-Height check, Warp Check, + Spike, Hole in Wall, overhang steps, sharp edges, minimal distance, bridge print, sphere, etc. The result from each printer are showed in the Figure 2 and some of the features are summarized + in the table after that. </p> + </div> + + + + <div class="col-lg-12"> + <!-- =========================== Imagen 11 y 12 =================== --> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal11" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Test_1.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 1 <figcaption> + </a> + </div> + </section> + </div> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal12" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Test_2.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 2 <figcaption> + </a> + </div> + </section> + </div> + <!-- =========================== Imagen 11 y 12 =================== --> + </div> + + <div class="col-lg-12"> + <div class="col-lg-offset-1 col-lg-10"> + <table class="table-data" style="width:100%"> + <tr> + <th> Test </th> <th> Ultimaker 2+ </th> <th> XYZ DaVinci 1.0 </th> + </tr> + <tr> + <td rowspan="2"> Nut, Size M4</td> <td rowspan="2"> ✔ </td> <td> ✖ </td> + </tr> + <tr> + <td> Not well define edges at the bottom</td> + </tr> + <tr> + <td>Wave (Rounded print)</td> <td> ✔ </td> <td> ✔ </td> + </tr> + <tr> + <td rowspan="2">Star (Sharp Edges)</td> <td rowspan="2"> ✔ </td> <td> ✖ </td> + </tr> + <tr> + <td> Not sharp edges, more rounded than sharp </td> + </tr> + <tr> + <td rowspan="2"> Name (complex shapes) </td> <td rowspan="2"> ✔ </td> <td> ✖ </td> + </tr> + <tr> + <td> Not quite defined</td> + </tr> + <tr> + <td rowspan="2"> Holes (3, 4 and 5 mm) </td> <td rowspan="2"> ✔ </td> <td> ✖ </td> + </tr> + <tr> + <td> rests of materials Through the hole </td> + </tr> + <tr> + <td rowspan="2"> Bridge print (2, 4, 8 and 16 mm) </td> <td> ✔ </td> <td> ✖ </td> + </tr> + <tr> + <td> The largest bridge show some curling below </td> <td> The small distances was fine at first but break very easy</td> + </tr> + <tr> + <td rowspan="2"> Hole in Wall </td> <td rowspan="2"> ✔ </td> <td> ✔ </td> + </tr> + <tr> + <td> The hole is ok but change to an ellipse </td> + </tr> + <tr> + <td rowspan="2"> Quarte shpere</td> <td rowspan="2"> ✔ </td> <td>✔ </td> + </tr> + <tr> + <td> The sphere is ok, but with some gaps at the top </td> + </tr> + </table> + </div> + </div> + + <div class="col-lg-12"> + <p align="justify" style="font-size:18px"> <br> After the test, I tried another model from thingiverse (<a href="https://www.thingiverse.com/thing:633081">Bulbasaur Planter High Res</a> ), + just to test an high resolution model with the best resolution in the Ultimaker 2+. The result was a beautiful planter with a very + smooth surface and very good finishing (Figure 3 and 4)</p> + </div> + + <div class="col-lg-12"> + <!-- =========================== Imagen 13 y 14 =================== --> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal13" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Print_2.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 3 <figcaption> + </a> + </div> + </section> + </div> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal14" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Print_3.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 4 <figcaption> + </a> + </div> + </section> + </div> + <!-- =========================== Imagen 13 y 14 =================== --> + </div> + + <div class="col-lg-12"> + <h3 align="center"> <u> 3D Scanning </u> </h3></p> + + <p align="justify" style="font-size:18px"> For the 3D scanning I wanted to use a small figure to be able to print it in real scale after the scanning. That´s why I used an + <a href="http://animal-crossing.com/amiibo/collections/amiibo-figures">Tom Nook amiibo</a> (a small nintendo’s collectible from animal crossing game, figure 5). The scanner used was a + <a href="https://www.creaform3d.com/en/customer-support/legacy-products/first-generation-handyscan-3d-zscanner-700">Creaform – Handyscan 3D</a>, which works with the + <a href="https://www.creaform3d.com/en/new-features-vxelements">VX Elements</a> software.</p> + <p align="justify" style="font-size:18px">The procedure to make the 3D scanning is necessary to place positioning targets in the figure and, if possible, in a nonreflecting surface. + This positioning targets (made of reflective tape) are necessary in order to give the scan a location of the object. The position targets are important due to the manual operation of the + scan and the fact that is not always scanning from the same position. <br> + After the position targets are located, the scan needs to be connected to the PC and the VX Elements software ready for scanning. The Handyscan has a trigger to activate the laser + and the reflection received in the scanner sensors start to create the figure (Figures 6, 7 and 8)</p> + </div> + + <!-- =========================== Imagen 5, 6, 7 y 8 =================== --> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal1" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Scan_2.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 5 - Collectible with position targets ready for 3D scanning <figcaption> + </a> + </div> + </section> + </div> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal2" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Scan_3.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 6 - Positions Target are recognized first <figcaption> + </a> + </div> + </section> + </div> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal3" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Scan_4.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 7 - 3D Construction of the object <figcaption> + </a> + </div> + </section> + </div> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal4" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Scan_5.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 8 - More complete construction <figcaption> + </a> + </div> + </section> + </div> + + <!-- =========================== Imagen 5, 6, 7 y 8 =================== --> + + <div class="col-lg-12"> + <p align="justify" style="font-size:18px">Once the scan is complete is necessary to clean and fix the result. As is seen in figure 8, + the model is not quite complete: the white zones are holes in the model (positions targets and difficult points to reach with the laser). + To fix the model I used the open source <a href="http://www.meshlab.net/">Meshlab</a> software (Figure 9). In the figure 10 the holes in the model are more visible. + </p> + </div> + + + <!-- =========================== Imagen 9 y 10 =================== --> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal5" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Mesh_1.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 9 - STL file obtained from the 3D scanning in Meshlab <figcaption> + </a> + </div> + </section> + </div> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal6" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Mesh_2.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 10 - Closeup of the model to see the holes in it <figcaption> + </a> + </div> + </section> + </div> + <!-- =========================== Imagen 9 y 10 =================== --> + </div> + + <p align="justify" style="font-size:18px"> + The first step is to clean the model as much as possible, this is as simple as select and delete. After the model is clean I performed a + Poisson surface reconstruction with the parameters show in figure 11. This surface reconstruction fills the voids in the model predicting the shape of the surface + that should be in the holes. After the surface reconstruction is a good idea to smooth it, I made this using a Laplacian smooth with the parameters show in figure 12. </p> + + <!-- =========================== Imagen 11 y 12 =================== --> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal7" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Mesh_4.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 11 - Poisson surface reconstruction in Meshlab <figcaption> + </a> + </div> + </section> + </div> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal8" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Mesh_5.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 12 - Laplacian smooth in Meshlab <figcaption> + </a> + </div> + </section> + </div> + <!-- =========================== Imagen 11 y 12 =================== --> + + <div class="col-lg-12"> + <p align="justify" style="font-size:18px"> As is can be see the surface reconstruction (figure 11) a demi sphere was created below the model, this is a problem with a very simple solution: + in the <a href="https://ultimaker.com/en/products/cura-software">cura</a> software (or any other software to control the 3D printer o generate the .gcode) move the model until the + non-flat part is below the workspace of the 3D printer. The 3D printing of the scanned model is shown in figure 13, besides some curling of the filament in some areas + (probably lack of supports) the result was quite good, and now Tom Nook has a twin (or something like that). + </p> + </div> + + <div class="col-lg-12"> + <!-- =========================== Imagen 13 y 14=================== --> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal9" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Prints_1.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 13 - Model in Cura ready to print <figcaption> + </a> + </div> + </section> + </div> + <div class="col-lg-6"> + <section class="images" id="images"> + <div class="portfolio-item"> + <a href="#portfolioModal10" class="portfolio-link" data-toggle="modal"> + <div class="caption"> + <div class="caption-content"> + <i class="fa fa-2x"> Click to Enlarge </i> + </div> + </div> + <img src="img/Week_5/Prints_2.jpg" class="img-responsive" alt="Atom"> + <figcaption> Fig 14 - The original Tom Nook and his evil clone <figcaption> + </a> + </div> + </section> + </div> + <!-- =========================== Imagen 9 y 10 =================== --> + </div> + + <div class="col-lg-12"> + <p align="center" style="font-size:25px"><u> <br> Files </u> </p> + <p align="justify" style="font-size:18px"> <br> In this section the files generated during the development of the assignment will be available to download. The files of the models + of the 3D printer tests are available in thingiverse, the links were provided as they were mentioned. </p> + <p> <br> + <table class="table-data"> + <tr> + <td> <a href="http://www.mediafire.com/file/679978dfwvdqv83/Scan_result.stl" download> + <img src="img/ico/stl.jpg" width="100px" height:"40px"> + </a> </td> + <td> <a href="http://www.mediafire.com/file/u5tj437p5262qb7/Meshlab_project.zip" download> + <img src="img/ico/meshlab.jpg" width="100px" height:"40px"> </a> + </td> + <td> <a href="http://www.mediafire.com/file/r2k6tga85iargd4/Fix_Model.stl" download> + <img src="img/ico/stl.jpg" width="100px" height:"40px"> </a> + </td> + <td> <a href="http://www.mediafire.com/file/sn73k3l3462abhw/Tom_Nook_model.gcode" download> + <img src="img/ico/gcode.jpg" width="100px" height:"40px"> </a></a> + </td> + </tr> + <tr> + <td> <a href="http://www.mediafire.com/file/679978dfwvdqv83/Scan_result.stl" download> Scan_result.stl </td></a> + <td> <a href="http://www.mediafire.com/file/u5tj437p5262qb7/Meshlab_project.zip" download> Meshlab_project.zip</td> </a> + <td> <a href="http://www.mediafire.com/file/r2k6tga85iargd4/Fix_Model.stl" download> Fix_model.stl</td></a> + <td> <a href="http://www.mediafire.com/file/sn73k3l3462abhw/Tom_Nook_model.gcode" download>Tom_Nook_model.gcode</td></a> + </tr> + + </table> + + </p> + </div> + + + + </div> + </section> + + <!-- Footer --> + <footer class="text-center"> + <div class="footer-above"> + <div class="container"> + <div class="row"> + <div class="footer-col col-md-6"> + <h3>Fab Lab <br> Ciudad de México</h3> + <p> <a href="http://www.fablab.mx/">www.fablab.mx</a> + <br>Anáhuac México | Campus Norte + <br> Av. Universidad Anáhuac 46 + <br> Col. Lomas Anáhuac + <br> Huixquilucan, Estado de México, C.P. 52786</p> + </div> + <!-- <div class="footer-col col-md-4"> + <h3>Around the Web</h3> + <ul class="list-inline"> + <li> + <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-facebook"></i></a> + </li> + <li> + <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-google-plus"></i></a> + </li> + <li> + <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-twitter"></i></a> + </li> + <li> + <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-linkedin"></i></a> + </li> + <li> + <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-dribbble"></i></a> + </li> + </ul> + </div> --> + <div class="footer-col col-md-6 "> + <h3>Contact Me</h3> + <p> Christian Cárdenas Jaramillo + <br> Universidad Anáhuac Querétaro + <br> <a href="mailto:christian.cardenas@anahuac.mx">christian.cardenas@anahuac.mx</a> + <br> Tel. + 52 (442) 245 67 42 Ext. 196</p> + </div> + </div> + </div> + </div> + <div class="footer-below"> + <div class="container"> + <div class="row"> + <div class="col-lg-12"> + Copyright © <a href="http://archive.fabacademy.org/archives/2017/ciudaddemexico/students/403/">Christian Cárdenas | Fab Academy 2017 </a> + </div> + </div> + </div> + </div> + </footer> + + + <!-- Scroll to Top Button (Only visible on small and extra-small screen sizes) --> + <!-- <div class="col-lg-8 col-lg-offset-2 text-center"> + <div class="scroll-top page-scroll"> + <a class="btn btn-lg btn-outline" href="#page-top"> + <i class="fa fa-chevron-up"> Back to top </i> + </a> + </div> + </div> --> + + <!-- Imagenes Modal %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% --> + <!-- Imagen 1 --> + <div class="portfolio-modal modal fade" id="portfolioModal1" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Scan_2.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + + <!-- Imagen 2 --> + <div class="portfolio-modal modal fade" id="portfolioModal2" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Scan_3.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + + <!-- Imagen 3 --> + <div class="portfolio-modal modal fade" id="portfolioModal3" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Scan_4.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + + <!-- Imagen 4 --> + <div class="portfolio-modal modal fade" id="portfolioModal4" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Scan_5.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + + <!-- Imagen 5 --> + <div class="portfolio-modal modal fade" id="portfolioModal5" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Mesh_1.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + + <!-- Imagen 6 --> + <div class="portfolio-modal modal fade" id="portfolioModal6" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Mesh_2.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + + <!-- Imagen 7 --> + <div class="portfolio-modal modal fade" id="portfolioModal7" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Mesh_4.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + + <!-- Imagen 8 --> + <div class="portfolio-modal modal fade" id="portfolioModal8" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Mesh_5.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + + <!-- Imagen 9 --> + <div class="portfolio-modal modal fade" id="portfolioModal9" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Prints_1.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- Imagen 10 --> + <div class="portfolio-modal modal fade" id="portfolioModal10" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Prints_2.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + + <!-- Imagen 11 --> + <div class="portfolio-modal modal fade" id="portfolioModal11" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Test_1.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- Imagen 12 --> + <div class="portfolio-modal modal fade" id="portfolioModal12" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Test_2.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- Imagen 13 --> + <div class="portfolio-modal modal fade" id="portfolioModal13" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Print_2.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- Imagen 14 --> + <div class="portfolio-modal modal fade" id="portfolioModal14" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Print_3.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- Imagen 15 --> + <div class="portfolio-modal modal fade" id="portfolioModal15" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Print_4.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- Imagen 16 --> + <div class="portfolio-modal modal fade" id="portfolioModal16" tabindex="-1" role="dialog" aria-hidden="true"> + <div class="modal-content"> + <div class="close-modal" data-dismiss="modal"> + <div class="lr"> + <div class="rl"> + </div> + </div> + </div> + <div class="container"> + <div class="row"> + <div class="col-lg-12 col-md-10"> + <div class="modal-body"> + + + <img src="img/Week_5/Print_5.jpg" class="img-responsive" alt="Atom" style="width:100%; height:auto"> + + + <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- jQuery --> + <script src="vendor/jquery/jquery.min.js"></script> + + <!-- Bootstrap Core JavaScript --> + <script src="vendor/bootstrap/js/bootstrap.min.js"></script> + + <!-- Plugin JavaScript --> + <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script> + + <!-- Contact Form JavaScript --> + <script src="js/jqBootstrapValidation.js"></script> + <script src="js/contact_me.js"></script> + + <!-- Theme JavaScript --> + <script src="js/freelancer.min.js"></script> + +</body> + +</html> diff --git a/index.html b/index.html index 1cad7d1..2724eda 100644 --- a/index.html +++ b/index.html @@ -145,7 +145,7 @@ <img src="img/index/Week4.jpg" class="img-responsive" alt=""> </a> </div> - <!-- <div class="col-sm-3 portfolio-item"> + <div class="col-sm-4 portfolio-item"> <a href="Week_5.html" class="portfolio-link"> <div class="caption"> <div class="caption-content"> @@ -156,7 +156,7 @@ <img src="img/index/Week5.jpg" class="img-responsive" alt=""> </a> </div> - <div class="col-sm-3 portfolio-item"> + <!-- <div class="col-sm-3 portfolio-item"> <a href="Week_6.html" class="portfolio-link"> <div class="caption"> <div class="caption-content"> -- GitLab